SwiftUI で Spacer() に .padding()【混ぜるな危険】

環境

macOS Ventura 13.6.4
Xcode 15.2

次のコードの結果は？

var body: some View {
    VStack() {
        Text("Hello, World!")
        Spacer()
        Rectangle()
            .fill(.red)
    }
}

結果

次のコードの結果は？

var body: some View {
    VStack() {
        Text("Hello, World!")
            .padding(.horizontal)
        Spacer()
        Rectangle()
            .fill(.red)
    }
}

結果

次のコードの結果は？

var body: some View {
    VStack() {
        Group {
            Text("Hello, World!")
            Spacer()
        }
        Rectangle()
            .fill(.red)
    }
}

結果

次のコードの結果は？

var body: some View {
    VStack() {
        Group {
            Text("Hello, World!")
            Spacer()
        }
        .padding(.horizontal)
        Rectangle()
            .fill(.red)
    }
}

結果

なんと Spacer が 縦方向に伸びました。見たところ、 Rectangle と同等の力を持ったようです。

次のコードの結果は？

Spacer に padding を付けてみます。

var body: some View {
    VStack() {
        Text("Hello, World!")
        Spacer()
            .padding()
        Text("Hello, World!")
        Spacer()
            .padding(.vertical)
        Text("Hello, World!")
        Spacer()
            .padding(.horizontal)
        Rectangle()
            .fill(.red)
    }
}

結果

.vertical でも .horizontal でも指定なしでも 縦方向に Rectangle と同等の力を持つようです。

終わりに

この機能を積極的に使うことはあまりないと思いますが、ハマった人のために筆を取りました。