SmallDeskSoftware 
Picker でのユーザーによる選択がどのように値として扱われるかを説明します。
Sponsor Link
Picker の使い方
Picker は、ユーザーが提示された選択肢から選択することができるコントロールです。
Picker コード
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
// // ContentView.swift // // Created by : Tomoaki Yagishita on 2020/10/29 // © 2020 SmallDeskSoftware // import SwiftUI enum Options: String, Identifiable, CaseIterable { case option1 = "OptionValue1" case option2 = "OptionValue2" case option3 = "OptionValue3" var id: String { self.rawValue } } struct ContentView: View { @State private var selectedOption: Options = .option1 var body: some View { VStack { Picker("Select option", selection: $selectedOption, content: { Text("Option1").tag(Options.option1) Text("Option2").tag(Options.option2) Text("Option3").tag(Options.option3) }) .padding() Text("selected option value is \(selectedOption.rawValue)") .padding() } .padding() } } |
selection に設定される値
選択肢が選択されると、selection に渡された Binding に選択肢の値が セットされます。
このため、選択肢の各要素に設定される .tag の値のタイプは、Picker の selection に渡される値のタイプと 一致する必要があります。
つまり、選択肢の .tag に設定された値が、selection に設定されることになります。
ForEach による自動設定
選択対象が、Identifiable の時に、ForEach を使用すると、自動的に .tag に rawValue が設定されると Apple のドキュメントに記載されています。
ですが、Xcode12.1 時点では、期待通りに動作しません。
ForEach を使った Picker
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 |
// // ContentView.swift // // Created by : Tomoaki Yagishita on 2020/10/29 // © 2020 SmallDeskSoftware // import SwiftUI enum Options: String, Identifiable, CaseIterable { case option1 = "OptionValue1" case option2 = "OptionValue2" case option3 = "OptionValue3" var id: String { self.rawValue } } struct ContentView: View { @State private var selectedOption: Options = .option1 @State private var selectedFlavor = Flavor.chocolate var body: some View { VStack { Picker("Select option", selection: $selectedOption) { ForEach(Options.allCases, id:\.id) { option in Text(option.rawValue.capitalized) .tag(option) // (1) } } .padding() Text("selected option value is \(selectedOption.rawValue)") .padding() } .padding() } } |
コード解説
- Apple のドキュメントでは、この .tag は不要のはずですが、Xcode12.1 では、この指定が無いと 値が選択されません
まとめ： Picker で選択された値の扱い
Picker で選択された値の扱い
- content に渡された要素が選択肢として表示される
- 選択肢が選択されると、その選択肢の .tag 値が selection に設定される
- 選択肢に、.tag 指定された値のタイプと selection のタイプは一致する必要がある
説明は以上です。
不明な点やおかしな点ありましたら、ご連絡いただけるとありがたいです。
Sponsor Link
