SwiftUI 填充 Vstack 剩余空间答案

【问题标题】：SwiftUI fill Vstack remaining spaceSwiftUI 填充 Vstack 剩余空间
【发布时间】：2021-10-29 15:42:29
【问题描述】：

我目前正在我的 SwiftUI 应用程序中构建一些小信息片段，并希望蓝色背景色填充轮廓空间的其余部分（这只是在 Xcode 中的预览中突出显示的）。我怎样才能做到这一点？

HStack {
    VStack {
        Text("Total Yield").padding([.trailing, .leading, .top])
        Text("3.0 oz").padding([.trailing, .leading, .bottom])
    }
    .background(Color.blue)
    .frame(maxWidth: .infinity)

    Spacer()

    VStack {
        Text("Ice").padding([.trailing, .leading, .top])
        Text("None").padding([.trailing, .leading, .bottom])
    }
    .background(Color.blue)
    .frame(maxWidth: .infinity)

    Spacer()

    VStack {
        Text("Glass").padding([.trailing, .leading, .top])
        Text("Coupe").padding([.trailing, .leading, .bottom])
    }
    .background(Color.blue)
    .frame(maxWidth: .infinity)
}
.padding()

我假设将帧 maxWidth 设置为无穷大可以实现这一点，但似乎没有达到预期的效果。

【问题讨论】：

标签： ios swift swiftui

【解决方案1】：

修饰符的顺序很重要。如果你想让蓝色的.background 使用扩展框架，它需要在.frame 之后。

.frame(maxWidth: .infinity)
.background(Color.blue)

结果：

【讨论】：