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

SwiftUI

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)")
        }
    }
}

ちょっと変な例にしていますが、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)")
        }
    }
}

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です