すでに紹介したオブジェクトとして VStack があります。VStackは { … } の中に含まれるオブジェクトを縦に並べるオブジェクトになりますが、このようなオブジェクトにも調整を行うことができます。ここではVStackに適切な余白をつけてみます。

  • 前回のコードに続けて書く
  • 縦並びのレイアウトを作る VStack オブジェクト
  • VStackに .padding を追加する
    • .padding( .horizontal, 20.0 ) : VStackの左右に20ptの余白

コード

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            Text( "あいうえお" )
            .font( .title )
            
            Image( "CC0_01" )
            .resizable()
            .scaledToFit()
        }
        .padding( .horizontal, 20.0 )
    }
}

結果

swiftui_1_3_3_1.png