Android TV 版本Jetpack Compose 按钮文本居中问题

使用Jetpack Compose编写App界面已是Android Studio默认推荐。

在开发TV版本界面时，发现androidx.tv.material3.Button 里的文本默认是左对齐，与手机版本的默认居中不同。为了让文本居中，折腾了一通。

首先，想到的是在Button 里加属性contentAlignment = Alignment.Center

Button(
    onClick = { /* Your click action */ },
    contentAlignment = Alignment.Center
) {
    Text("Button Text")
}

没想到，androidx.tv.material3.Button 没有 contentAlignment 这个属性。

然后，想到modifier = Modifier.wrapContentSize()

Button(
    onClick = { /* Your click action */ },
    modifier = Modifier.wrapContentSize()
) {
    Text("Button Text")
}

这种方法文本是居中了，但是按钮大小也被改变了。一个单独的按钮还好说，但是一排按钮，每个大小都不一致，确实挺难看，还是得另想办法。

试了多种方案后，发现在Text外面套一层Box，然后在Box属性里把内容居中就ok了，示例代码如下：

Button(
    onClick = { /* Your click action */ },
   
) {
     Box(
          modifier = Modifier.fillMaxWidth(),
          contentAlignment = Alignment.Center
      ) {
          Text("Button Text")
     }
}