Android Jetpack Compose：显示条件错误文本时OutlinedButton消失

问题原因 #

你遇到的添加按钮消失问题，核心是错误提示Text用了Modifier.fillMaxSize()——这个修饰符会占满父容器的所有可用空间，当错误文本显示时，它会把下方的添加按钮完全挤出可见区域，导致按钮无法显示。

快速修复 #

把错误Text的fillMaxSize()换成fillMaxWidth()，让文本只占满宽度，不占用全部高度，这样就不会挤压下方的按钮：

if (state.periodError != null) {
    Text(
        text = state.periodError,
        color = MaterialTheme.colorScheme.error,
        textAlign = TextAlign.Start,
        modifier = Modifier.fillMaxWidth() // 替换原有的fillMaxSize()
    )
}

更规整的布局优化 #

建议把recurring条件下的Row和错误Text用Column包裹，让垂直排列更清晰，避免布局嵌套混乱：

if (mainViewModel.recurring) {
    Column {
        Row() {
            // 原有OutlinedTextField和ExposedDropdownMenuBox代码
        }
        if (state.periodError != null) {
            Text(
                text = state.periodError,
                color = MaterialTheme.colorScheme.error,
                textAlign = TextAlign.Start,
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(top = 4.dp) // 加个上边距，和输入区域拉开距离
            )
        }
    }
}

额外优化建议 #

1. 别直接访问ViewModel的属性（比如mainViewModel.recurringPeriod），建议用collectAsState()收集状态，符合Compose状态管理的最佳实践，避免状态不一致。
2. 下拉菜单的复数文本可以直接用Android资源的复数规则处理，不用手动判断数字，减少重复代码。
3. 给错误文本加个小上边距，视觉上更舒服。

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