前回、部品として使えるViewをつくることができました。しかし全く同じものをたくさん増やせるだけではあまり意味がありません。そこで今回は部品に変更できる余地を持たせて、値によって様子が変わるようにしてみます。具体的にはView部品に 初期の値を持たない変数 を追加します。

  • SceneryRow.swiftを開き, SceneryRowに変数 title を追加する
    • 前回Textに固定で入力した ”景色” を, title に置き換える

コード1

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
import SwiftUI

struct SceneryRow : View {
    var title: String
    
    var body: some View {
        HStack {
            Text( title )
        }
    }
}

SceneryRowに初期の値がないtitleを追加しました。 これによって一時的にエラーが起きますが、気にしないでください。View部品に値のない変数があった場合、部品を使うときに値が求められます。今回はSceneryRowにtitleの値が必要になりましたので、SceneryRowにtitleの値を渡してあげるようにします。

  • ContentView.swiftを開き、SceneryRowにtitleの値を渡す
    • 5つあるので、それぞれ渡す値を変えてみる

コード2

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

struct ContentView: View {
    var body: some View {
        List {
            Section( "景色情報" ) {
                SceneryRow( title:"景色1" )
                SceneryRow( title:"景色2" )
                SceneryRow( title:"景色3" )
                SceneryRow( title:"景色4" )
                SceneryRow( title:"景色5" )
            }
        }
        .listStyle( .grouped )
    }
}

SceneryRowの内容がtitleで指定したものに変わったことがわかります。

結果

swiftui_2_3_2_1.png