JetPack Compose - 从视图中删除额外的填充

Question

我有几个图标row

    Row {
    IconButton {
        Icon(
            painter = painterResource(R.drawable.im1)
        )
    },
    IconButton {
        Icon(
            painter = painterResource(R.drawable.im2)
        )
    }
}

但是当它显示时，两个图标之间的距离比row我预期的要大。我感觉它们之间有 32dp 的间隔。如何减少 2 个图标之间的距离row？

Answer 1

2 个图标之间的空间不是填充，而是取决于 的默认大小IconButton。
这是由于可访问性触摸目标并允许正确的最小触摸目标尺寸。
您可以更改它，禁用LocalMinimumTouchTargetEnforcement并将 aModifier.size(24.dp)应用于IconButton：

CompositionLocalProvider(LocalMinimumTouchTargetEnforcement provides false){
    Row {
        IconButton(modifier = Modifier.size(24.dp),
            onClick = {}) {
            Icon(
                painter = painterResource(R.drawable.ic_add_24px),""
            )
        }
        IconButton(modifier = Modifier.size(24.dp),
            onClick = {}) {
            Icon(
                painter = painterResource(R.drawable.ic_add_24px),""
            )
        }
    }
}

作为替代方案，您可以将 anIcon与 一起使用Modifier.clickable：

Row {
    Icon(
            painter = painterResource(R.drawable.ic_add_24px),"",
        modifier = Modifier.clickable (onClick = {} )
        )
    Icon(
            painter = painterResource(R.drawable.ic_add_24px),"",
        modifier = Modifier.clickable (onClick = {} )
        )
}