Android Compose中小尺寸OutlinedButton无法左对齐的解决方法

问题根源 #

OutlinedButton默认自带64.dp的最小宽度约束（来自ButtonDefaults.outlinedButtonMinWidth），即便你通过Modifier.defaultMinSize设置了更小尺寸，这个内置约束依然会生效，导致按钮实际宽度大于预期值，看起来像是存在左外边距。

修复方案 #

直接在OutlinedButton的参数中指定minWidth和minHeight，覆盖默认的最小尺寸约束，同时保留contentPadding = PaddingValues(0.dp)消除内部边距：

@Composable
fun ButtonPreview() {
  SetelTheme {
    Surface(
      color = Color.Red.copy(alpha = 0.3f),
      modifier = Modifier.fillMaxWidth(),
    ) {
      Column(
        horizontalAlignment = Alignment.Start,
      ) {
        OutlinedButton(
          onClick = {},
          border = BorderStroke(1.dp, MaterialTheme.colorScheme.primary),
          shape = RoundedCornerShape(4.dp),
          contentPadding = PaddingValues(0.dp),
          // 直接设置最小尺寸，覆盖默认约束
          minWidth = 24.dp,
          minHeight = 24.dp,
          modifier = Modifier.wrapContentSize(),
        ) {
          Text("1")
        }

        OutlinedButton(
          onClick = {},
          border = BorderStroke(1.dp, MaterialTheme.colorScheme.primary),
          shape = RoundedCornerShape(4.dp),
          contentPadding = PaddingValues(0.dp),
          modifier = Modifier.wrapContentSize(),
        ) {
          Text("big is ok")
        }
      }
    }
  }
}

补充说明 #

• 若想让按钮完全贴合内容，可设置minWidth = 0.dp，配合Modifier.wrapContentSize()实现完全紧凑的按钮样式。
• 不要依赖Modifier.defaultMinSize覆盖按钮内置最小宽度，Compose组件自身参数的优先级高于Modifier的尺寸约束。

内容的提问来源于stack exchange，提问作者You Qi