为什么按钮名称在 android jetpack compose 中无法正确显示？

我正在尝试在以下可组合函数中显示一个按钮。我已经正确定位了按钮，但它有文本“去学习”，它没有正确显示，就像只显示了很小的文本部分。以下是我的代码

@Composable
fun OnBoardingScreen6(navController: NavController) {
    Column(
        modifier = Modifier
            .fillMaxSize()
            .padding(26.dp),
        horizontalAlignment = Alignment.Start,
        verticalArrangement = Arrangement.Top
    ) {
        // Back icon at the top-left corner
        IconButton(
            onClick = {
                navController.popBackStack()
            },
            modifier = Modifier.padding(start = 8.dp, top = 8.dp)
        ) {
            Icon(
                imageVector = Icons.Default.ArrowBack,
                contentDescription = null,
                tint = Color(0xFF039be5)
            )
        }

        // Spacer between IconButton and Row
        Spacer(modifier = Modifier.height(20.dp))
        Row(
            modifier = Modifier
                .fillMaxWidth()
                .height(60.dp)
                .background(color = Color(0xFF008746))
                .padding(horizontal = 0.dp)
        ) {
            // Outer Row content

            Row(
                horizontalArrangement = Arrangement.SpaceBetween,
                modifier = Modifier
                    .width(360.dp)
                    .height(64.dp)
                    .padding(start = 16.dp, top = 16.dp, end = 16.dp, bottom = 16.dp)
                    .background(
                        color = Color(0xFF008746),
                    )
            ) {
                // Inner Row content
                Image(
                    painter = painterResource(id = R.drawable.check),
                    contentDescription = null,
                    modifier = Modifier
                        .size(24.dp)
                )

                Spacer(modifier = Modifier.width(16.dp)) // Add spacing between images

                Image(
                    painter = painterResource(id = R.drawable.close),
                    contentDescription = null,
                    modifier = Modifier
                        .size(24.dp)

                )
            }
        }

        // Spacer between Row and Texts
        Spacer(modifier = Modifier.height(20.dp))
        Row(modifier = Modifier
            .padding(start = 5.dp)
            .width(290.dp)
            .height(40.dp)) {
              Text(text = "All set",
                  style = TextStyle(
                      fontSize = 32.sp,
                      lineHeight = 40.sp,
                      fontFamily = FontFamily.Serif,
                      fontWeight = FontWeight(700),
                      color = Color(0xFF000000),
                  ))
        }
        Spacer(modifier = Modifier.height(20.dp))
        Row(modifier = Modifier
            .width(308.dp)
            .height(106.dp)) {
            Text(
                text = "You may now enroll in studies.\n \nThank you for your interest in Mayo Clinic research! ",
                        style = TextStyle(
                        fontSize = 20.sp,
                lineHeight = 28.sp,
                fontFamily = FontFamily.Serif,
                fontWeight = FontWeight(700),
                color = Color(0xFF000000),
            )
            )
        }
        // Spacer to push the button to the bottom
        Spacer(modifier = Modifier.weight(1f))
        Column(verticalArrangement = Arrangement.spacedBy(0.dp, Alignment.CenterVertically),
            horizontalAlignment = Alignment.CenterHorizontally) {
            // Button centered at the bottom
            Button(
                onClick = {
                    navController.navigate(Destinations.OnBoardingScreen5)
                },
                modifier = Modifier
                    .width(339.dp)
                    .height(48.dp)
                    .background(color = Color(0xFF0057B8), shape = RoundedCornerShape(size = 24.dp))
                    .padding(start = 24.dp, top = 12.dp, end = 24.dp, bottom = 12.dp)
                ,
                shape = RoundedCornerShape(percent = 50),
                colors = ButtonDefaults.buttonColors(Color(0xFF0057B8))
            ) {
                Text(text = "Go to studies", fontWeight = FontWeight.Bold, style =
                TextStyle(Color.White))
            }
        }

    }
}

我尝试将字体样式更改为正常，并以不同的方式为文本添加颜色，但文本无法正确显示，仅显示单词中一两个字符的一小部分。我需要从 Column 更改为 Box 吗？

你必须删除height(48.dp)来自modifier那个特定的按钮。

而且，您编写的代码非常复杂且不必要。您可以通过使用一些简单的方法来完全优化它，例如：

1. 无需将简单的可组合项包装在容器中，就像包装单个可组合项一样Button in Column你可以这样Button具有所需的属性。

2. 在某些情况下你可以避免Spacer并使用verticalArrangement反而。

3. 您不应该设置可组合常量的高度和宽度，因此您的 UI 将无法正确对齐和响应。

4. 探索主题，这样您就不需要一次又一次地为不同的可组合项编写相同的样式。

还可以有更多的改进，但是你可以从其他好的来源看到编码风格，并尝试编写代码，最终在练习后你会得到更好的结果。优化后，您将能够更有效地读取和更改相同的代码。