SwiftUIのPickerは、tagを使うと便利

Pickerでユーザーに選択してもらうときに、表示するものと、実際に選択する値が違うことってありますよね。

例えば、「15分」、「30分」、「45分」、「1時間」という選択肢があったときに、選択する値としては、15,30,45,60を使いたいとかです。

(すくなくとも自分は、)これまでは、選択のcallbackで変換した値を設定していました。

SwiftUIでもそうするしかないかなぁと思っていたのですが、もっとスマートな方法がありました。.tagを使うとマッピングできます。

struct ContentView: View {
    @State private var selectedValue = 15
    var body: some View {
        VStack {
            Picker(selection: $selectedValue, label: Text("Select")) {
                Text("15").tag(15)
                Text("22").tag(22)
                Text("35").tag(32)
            }
            Text("selected value : \(self.selectedValue)")
        }
    }
}

struct ContentView: View {

@State private var selectedValue = 15

var body: some View {

VStack {

Picker(selection: $selectedValue, label: Text("Select")) {

Text("15").tag(15)

Text("22").tag(22)

Text("35").tag(32)

}

Text("selected value : \(self.selectedValue)")

}

ちょっと変な例にしていますが、tagの中の数字は、0始まりでなくて良いのです。
なので、15を選択すると選択値は、15になります。

ちなみに、上記はText(“35”)のtagに32と設定してあるので、”35″を選択すると選択値は”32″になります。

上記は、IntでBindingしていますが、Stringでも同様に動きます。便利！

struct ContentView: View {
    @State private var selectedStr = "First"
    var body: some View {
        VStack {
            Picker(selection: $selectedStr, label: Text("Select")) {
                Text("1st").tag("First")
                Text("2nd").tag("Second")
                Text("4th").tag("Fourth")
            }
            Text("selected value : \(self.selectedStr)")
        }
    }
}

struct ContentView: View {

@State private var selectedStr = "First"

var body: some View {

VStack {

Picker(selection: $selectedStr, label: Text("Select")) {

Text("1st").tag("First")

Text("2nd").tag("Second")

Text("4th").tag("Fourth")

}

Text("selected value : \(self.selectedStr)")

}

Sponsor Link

コメントを残す コメントをキャンセル

コメントを残すコメントをキャンセル