SwiftUI：如何让Button自动填充VStack/HStack父视图宽度？

嘿，这个需求我太懂了！手动给每个按钮加frame确实麻烦，后期改起来也头疼。这里有几个不用逐个设置的好办法，能让你的按钮自动填满VStack的宽度，还方便维护：

方法一：用View扩展封装宽度设置 #

我们可以给View加一个简单的扩展，把“填充父容器宽度”的逻辑封装起来，之后所有需要的控件只要调用这个方法就行：

extension View {
    func fillParentWidth() -> some View {
        self.frame(maxWidth: .infinity)
    }
}

然后修改你的代码，给每个按钮/导航链接加上这个方法：

VStack(alignment: .center, spacing: 20) {
    NavigationLink(destination: CustomView()) {
        Text("Button")
    }
    .frame(height: 44)
    .background(Color.primary)
    .fillParentWidth() // 调用扩展方法
    
    Button(action: { self.isShowingAlert = true }) {
        Text("Another Button")
    }
    .frame(height: 44)
    .background(Color.primary)
    .fillParentWidth() // 调用扩展方法
}
.background(Color.secondary)
// 如果需要固定VStack宽度，直接加frame即可
.frame(width: 320)

这个方法的好处是灵活，不管是Button、NavigationLink还是其他控件，都能快速应用宽度填充逻辑。

方法二：自定义ButtonStyle（更推荐） #

如果你的按钮样式（比如高度、背景色）是统一的，那自定义ButtonStyle是最佳选择——把宽度、高度、背景甚至按压效果都封装进去，一次设置，全局复用：

struct FullWidthPrimaryButtonStyle: ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        configuration.label
            .frame(maxWidth: .infinity, height: 44) // 自动填充宽度+固定高度
            .background(Color.primary)
            .opacity(configuration.isPressed ? 0.8 : 1.0) // 可选的按压反馈
    }
}

然后你的代码会变得非常简洁：

VStack(alignment: .center, spacing: 20) {
    NavigationLink(destination: CustomView()) {
        Text("Button")
    }
    .buttonStyle(FullWidthPrimaryButtonStyle())
    
    Button(action: { self.isShowingAlert = true }) {
        Text("Another Button")
    }
    .buttonStyle(FullWidthPrimaryButtonStyle())
}
.background(Color.secondary)
.frame(width: 320)

以后要修改按钮样式（比如改高度、背景色），只需要修改FullWidthPrimaryButtonStyle这一处，所有用这个样式的按钮都会同步更新，维护成本极低！

为什么原来的代码不行？ #

简单说：默认情况下，Button和NavigationLink的宽度是由内部的Text内容决定的。你之前只设置了frame(height:44)，宽度还是自适应内容；加上maxWidth: .infinity后，控件会自动拉伸到父容器（这里就是VStack）的可用宽度，完美实现等宽填充的效果。

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