[SwiftUI]VStackを横幅いっぱい(fill width)にするには？

どうも、ちょげ(@chogetarou)です。

VStackを横幅いっぱいにする方法を紹介します。

方法
使用例

方法

VStackを横幅いっぱいにするには、frame修飾子を使います。

まず、VStackにframe修飾子を付与します。

そして、frameの引数「maxWidth」に「.infinity」を指定します。

VStack {
    //SomeView
}
.frame(maxWidth: .infinity)

frameを使うことで、VStackを横幅いっぱいにすることができます。

使用例

以下は、使用例です。

struct ContentView: View {
    var body: some View {
        VStack  {
            Text("Hello")
            Text("World")
            Text("SwiftUI")
        }
        .foregroundColor(Color.white)
        .frame(maxWidth: .infinity)
        .background(Color.blue)
    }
}