SwiftUI 1-2-1. 背景を設定するbackground

前節でSwiftUIの画面レイアウトの基本に触れました。その中でオブジェクトを自然と使ってきましたが、この節ではオブジェクト１つずつに注目して、オブジェクトをカスタマイズしていきましょう。ここではTextオブジェクトに背景をつけてみます。オブジェクトに .background() を追加します。

• SFSwiftUI01-2.swiftpm を開く (サンプルコード)

• Text( “こんにちわ” ) に .background( .indigo ) を追加

.indigoは色を指定しています。backgroundは色以外に画像や図形を指定することもできます。

• 色を指定 : .background( Color.indigo )
• 画像を指定 : .background( Image(…) )
• 図形を指定 : .background( ShapeStyle(…) )

コード

 1
 2
 3
 4
 5
 6
 7
 8
 9
10

import SwiftUI

struct ContentView: View {
    var body: some View {
        VStack {
            Text( "こんにちわ" )
            .background( .indigo )
        }
    }
}

結果