Android Jetpack 编写 IconButton 填充

Question

如何删除 IconButton 中的填充？我希望我的专栏中的项目具有相同的开始填充

Column(
    modifier = Modifier
        .fillMaxWidth() 
        .padding(horizontal = 16.dp)
) {
    IconButton(onClick = { }) {
        Icon(asset = Icons.Filled.Search)
    }
    Text("Some text")
}

Answer 1

With 1.0.x IconButton 应用此修饰符：IconButtonSizeModifier = Modifier.size(48.dp).
这是由于 可访问性 触摸目标并允许正确的最小触摸目标大小。

您可以使用类似的方式修改它：

IconButton(modifier = Modifier.
        then(Modifier.size(24.dp)),
    onClick = { }) {
    Icon(
        Icons.Filled.Search,
        "contentDescription",
        tint = Color.White)
}

重要的是使用 .then 以正确的顺序应用 size。

Answer 2

用 CompositionLocalProvider 包裹 IconButton 以覆盖 LocalMinimumTouchTargetEnforcement 的值，强制执行最小触摸目标 48.dp。

CompositionLocalProvider(
    LocalMinimumTouchTargetEnforcement provides false,
) {
    IconButton(onClick = { }) {
        Icon(
            imageVector = Icons.Filled.Search,
            contentDescription = "Search",
        )
    }
}

Android Jetpack 编写 IconButton 填充

Android Jetpack compose IconButton padding

android

android-button

android-jetpack-compose