可滚动标签行的边缘填充

Question

我有一个关于 ScrollableTabRow 和边缘填充的问题

是否可以只为里面的项目设置填充，而不是左右边缘？

简化代码：https://gist.github.com/a/4cd4994c91b4de2c59d7f6a1f5f1da12

我需要的是：

https://imgur.com/a/TbIbOVP

但我得到这样的结果，

https://imgur.com/a/FspxhVU

也许我设置错了，或者有一些我无法更改的内部填充？ （基本上我需要将项目之间的填充设置为 16.dp）

我设法使用惰性行得到了我想要的东西： https://gist.github.com/a/4fdb1b124e067e5ec8d50b933477bea7

https://imgur.com/a/DzM6IKy

但这意味着要为指标实现逻辑，如果可能的话，我想避免这种情况

Answer 1

找不到解决方案，所以我选择了惰性行和自定义指标

Answer 2

我看不懂你的代码。

我解决了你的问题：

Basically i need to set the padding between items to be 16.dp

通过添加 Tab 变形器并为其设置填充。

@Composable
fun Sample(){
    ScrollableTabRow(
        backgroundColor = Color.Transparent,
        selectedTabIndex = 0,
        edgePadding = 24.dp,
        modifier = Modifier.height(80.dp)
    ) {
        (1..20).forEach { index ->
            Tab(
                selected = false,
                onClick = { },
                modifier = Modifier.padding(10.dp)
            ){
                Text("DemoBox_$index")
            }

        }
    }
}

Answer 3

您可以使用 edgePadding = 0.dp 删除此填充，如下所示：

crollableTabRow(
        selectedTabIndex = 0, indicator = { tabPositions ->
            Box(
                modifier = Modifier
                    .tabIndicatorOffset(tabPositions[pagerState.currentPage])
                    .height(4.dp)
                    .padding(horizontal = 8.dp)
                    .background(color = Color.Blue, shape = RoundedCornerShape(8.dp))
            ) {})
        }, modifier = Modifier.fillMaxWidth(), edgePadding = 0.dp, backgroundColor = colorResource(
            id = R.color.white
        )
    )