🗓️

【SwiftUI】DatePickerと.onTapGestureを一緒に使用すると起こるバグ

2024/04/04に公開

はじめに

DatePicker.onTapGestureを同一のビューで使用した場合、.onTapGestureの処理が優先され、DatePickerで日付が選択出来なくなってしまいました。
調べてみてもこれだという情報がなかなか見つからなかったので記事にしました。

原因

iOS17.1からのバグなようです。

どうなってしまうのか

タップで背景色が変更されるビューの中にDatePickerが入っています。
DatePickerをタップすると、背景色は変わりますが日付の変更が出来ません。

解決策

DatePicker自体にダミーの.onTapGestureを新たに追加することで、DatePickerのタップが有効になりました。
他にもいい方法があったら教えてください。

import SwiftUI

struct TestView: View {
    @State var deliveryDate: Date = Date()
    @State var index: Int = 0
    let colors: [Color] = [.yellow, .green, .blue, .indigo]

    var body: some View {

        VStack{
            DatePicker("", selection: $deliveryDate, in: Date() ... Calendar.current.date(byAdding: .month, value: 1, to: Date())!
                       , displayedComponents: .date)
            .datePickerStyle(.graphical)
            //99回タップしないと動作しないダミーのジェスチャーを追加する
            .onTapGesture(count: 99, perform: { })

        }
        .frame(maxHeight: .infinity)
        .background(colors[index].opacity(0.3))
        .onTapGesture {
            if index >= 3{
                index = 0
            }else{
                index += 1
            }
        }
    }
}

参考ページ

https://stackoverflow.com/questions/77373659/swiftui-datepicker-issue-ios-17-1

Discussion