Jetpack Compose按钮文本为何不自动大写？如何修改主题实现全大写？

哎，我当初用1.0.0-beta01版本的时候也踩过这个坑！虽然官方文档里说按钮文本应该是全大写，但这个版本里默认的主题配置确实没自动帮我们做这件事，得手动调整一下主题的Typography设置才行。

核心原因 #

Compose的Material Design规范里，按钮文本样式确实要求全大写，但在早期beta版本中，默认的Typography配置里的button样式可能没显式指定textTransform = TextTransform.Uppercase，或者你的自定义主题覆盖了默认样式却漏掉了这个属性。

修改主题配置的具体步骤 #

1. 找到你项目里的主题定义文件（一般叫Theme.kt），定位到自定义的Typography对象或者主题中引用的Typography配置。
2. 显式为button样式添加textTransform = TextTransform.Uppercase属性：

示例1：自定义完整Typography并应用

// 定义项目专属的Typography，确保button样式包含全大写设置
val AppTypography = Typography(
    button = TextStyle(
        fontWeight = FontWeight.W500,
        fontSize = 14.sp,
        letterSpacing = 1.25.sp,
        textTransform = TextTransform.Uppercase // 这一行是关键！
    ),
    // 其他文本样式（比如h1、body1等）可以保留默认或按需自定义
    defaultFontFamily = FontFamily.Default
)

// 在主题函数中应用这个配置好的Typography
@Composable
fun MyAppTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    content: @Composable () -> Unit
) {
    val colors = if (darkTheme) DarkColorPalette else LightColorPalette

    MaterialTheme(
        colors = colors,
        typography = AppTypography, // 引用我们配置的Typography
        shapes = Shapes,
        content = content
    )
}

示例2：基于默认Typography修改按钮样式

如果你不想完全自定义Typography，只想在默认基础上调整按钮样式，可以这样做：

val ModifiedTypography = MaterialTheme.typography.copy(
    button = MaterialTheme.typography.button.copy(
        textTransform = TextTransform.Uppercase
    )
)

// 在主题里替换默认的typography
MaterialTheme(
    typography = ModifiedTypography,
    // 其他属性（colors、shapes）保持不变
    content = content
)

验证效果 #

修改完主题后，所有使用MaterialTheme.typography.button样式的按钮（包括默认的Button组件）都会自动将文本转为全大写了。如果只是单个按钮需要临时大写，也可以直接在Text组件里设置style = TextStyle(textTransform = TextTransform.Uppercase)，但通过主题配置能统一整个App的样式，更符合Material规范。

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