[SwiftUI] SwiftUI の List でも、複数選択だけでなく、単数選択もできます

⌛️ < 1 min.

SwiftUI の List は、複数選択しかできないと思っていたのですが、いつのまにか単数選択もできるようになっていました。

[SwiftUI] SwiftUI の List で selection が有効にならないときにチェックすること

Sponsor Link

List が持つ選択関連の API

セレクションの Set を渡す API 。なので、当然、複数選択になります。（新しい要素を選択しても、以前から選択されている要素は選択されたまま）

example code


init(selection: Binding>?, content: () -> Content)

Apple のドキュメントは、こちら。

先の記事を書いたときには、このインターフェースしかなかったのですが、調べてみたら増えてました。

example code


init(selection: Binding?, content: () -> Content)

リストの要素を選択要素として渡す API 。新しい要素を選択すると、先に選択されていた要素は、非選択になります。optional で保持するので、１つの要素も選択されていない状態を作ることも可能。

Apple のドキュメントは、こちら。

ただ、なにも選択されていない状況が起こり得るので、確実に選択して欲しいときは工夫が必要。

サンプルコード

以下のコードで動作を確認することができます。

example code


//
//  ContentView.swift
//  SelectionList
//
//  Created by Tomoaki Yagishita on 2020/05/24.
//  Copyright © 2020 SmallDeskSoftware. All rights reserved.
//

import SwiftUI

struct ContentView: View {
    @State var datas = ["item1", "item2", "item3"]
    @State var itemsSelection:Set = Set()
    @State var itemSelection:String?

    var body: some View {
        VStack {
            GroupBox(label: Text("Multiple Selection")) {
                List(selection: $itemsSelection, content: {
                    ForEach(datas, id: \.self) { str in
                        Text("\(str)")
                    }
                } )
                .environment(\.editMode, .constant(.active))
            }
            GroupBox(label: Text("Single Selection")) {
                List(selection: $itemSelection) {
                    ForEach(datas, id: \.self) { str in
                        Text("\(str)")
                    }
                }
                .environment(\.editMode, .constant(.active))
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}