SmallDeskSoftware 
List は非常に良く出来たビューなのですが、.environment との関係に気づかないと困ることがあります。今回は、editMode との関係を説明します。
[SwiftUI] SwiftUI の List で selection が有効にならないときにチェックすること
Sponsor Link
Listで要素を選択させたいとき
SwiftUI の List のイニシャライザに選択を表す変数を渡すことができるので、以下のように書くと、選択が変数に反映されるハズです。
example code
struct ContentView: View {
@State var datas = ["item1", "item2", "item3"]
@State var itemSelection:String?
var body: some View {
List(selection: $itemSelection) {
ForEach(datas, id: \.self) { str in
Text("\(str)")
}
}
}
}
のはずなのですが、上記のコードではいくらやってもリストの要素を選択できるようになりません。
.editModeを、active にする必要がありました
.environment モディファイアを使用して、editMode を active にする必要があります。
コード
.environment(\.editMode, .constant(.active))
全体のコードは、以下のようになります。
コード
struct ContentView: View {
@State var datas = ["item1", "item2", "item3"]
@State var itemSelection:String?
var body: some View {
List(selection: $itemSelection) {
ForEach(datas, id: \.self) { str in
Text("\(str)")
}
}
.environment(\.editMode, .constant(.active))
}
}
まとめ: List で セレクションを可能にする方法
List で セレクションを可能にする方法
- .editMode を .active にする
- 引数の selection は、Binding<Set<>?> にすると複数選択でき、Binding<?>で単数選択となる
[SwiftUI] SwiftUI の List でも、複数選択だけでなく、単数選択もできます
なぜ、ハマりやすいか
似たような UI として、Picker がありますが、Picker には、.editMode は不要です。
途中まで、Picker を使っていたのを List に切り替えると、.editMode の必要性に気づかず、悩むことになります。
Picker のようなユーザーとのやり取りを前提としたコンポーネントと、List のように汎用に作られたコンポーネントとの違いに気をつける必要があります。
説明は以上です。
不明な点やおかしな点ありましたら、ご連絡いただけるとありがたいです。
関連記事:
Sponsor Link
