SwiftUI 如何实现List容器内按钮的文字居中显示

你遇到的问题是List默认的Button样式约束导致的：使用Button("标题") {}这种便捷构造方法时，系统生成的按钮内部文本会默认继承列表按钮的左对齐规则，直接给Button外层添加.frame(maxWidth: .infinity, alignment: .center)仅会修改按钮容器的尺寸，不会作用到内部的文本布局，所以不生效。

可行的解决方法 #

自定义Button的label，将居中修饰符加在文本控件上即可：

struct HomeView: View {
    var body: some View {
        List {
            ForEach(["1", "2"], id: \.self) {
                Text("\($0)…").frame(maxWidth: .infinity, alignment: .center)
            }

            Button {
                // 此处写按钮的点击逻辑
            } label: {
                Text("Action button")
                    .frame(maxWidth: .infinity, alignment: .center)
            }
        }
    }
}

这种写法同时还会让按钮的可点击范围撑满整个列表行，符合大部分开发场景的交互需求。如果需要调整按钮的样式，可以额外搭配.buttonStyle modifier实现，比如.buttonStyle(.plain)保留无底色的系统列表按钮样式，或者.buttonStyle(.borderedProminent)使用凸显式按钮样式，都可以适配居中效果。

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