[SwiftUI]タップもドラッグ&ドロップもできるSlider

デフォルトのSliderはタップできない

意外でしたが、デフォルトだとタップで変更(つまみが動かない)ができません。

https://youtu.be/L7Rb3M5FSSY

コードはこんな感じかと思います。

struct SliderView: View {
  @State private var rValue: Double = 0
  @State private var rText: String = "0"
  @State private var sliderValue: Double = 0.0
  
  var body: some View {
    VStack {
      HStack {
        Text("Red:")
          .foregroundColor(.red)
        
        // タップで変化ができない
        Slider(value: Binding(
          get: {
            self.rValue
          },
          set: { newValue in
            self.rValue = newValue
            self.rText = String("\(Int(self.rValue))")
            
          }
        ), in: 0...255, step: 1, onEditingChanged: {_ in })
        TextField("", text: $rText, onEditingChanged: { _ in
          rValue = Double(rText) ?? 0
        })
      }
      .padding(.bottom, 8)
      
      // onEditingChangedは設定しなくても、つまみは動かせる
      Slider(value: $sliderValue, in: 0...10, step: 0.1)
    }
  }
}

onEditingChangedなどの引数でできるようになるかも？とか思いましたが無理そうでした。

タップもドラッグ&ドロップもできる

stackoverflowで調べてみました。

https://stackoverflow.com/questions/58687298/setting-the-value-of-a-swiftui-slider-by-tapping-on-it
↑のページに答えが載ってました。現時点では、Answersの2番目のものがタップもドラッグ&ドロップもできる例になります。1番目のものは、タップはできるけど、ドラッグ&ドロップでつまみがついて来ないです。

例: ドラッグ&ドロップでつまみがついて来ない
https://youtu.be/OiI3sZ2cPL0

例: つまみがついてくるパターン、Answersの2番目
https://youtu.be/q0ndkz3nu7s
コードはこんな感じです。
https://github.com/na8esin/SwiftUI-Cookbook/blob/7a8fb6398bcf82ef476578ad0a6a9cb39adcbe11/SwiftUI-Cookbook/Slider/NewTappableSliderView.swift

ただ、このやり方だとSliderのonEditingChangedが発火しないようなので、さらに改良は必要そうです。