余白を押した時に反応させる場合はcontentShapeを使う

ListやFromを使用した時のCellにTextを使ったとして、表示される文字を押すと反応するが、余白を押すと反応しない。
contentShape()を使用すると余白にも反応する。
毎回忘れて検索するので、書いておく。

struct ContentView: View {
    @State var showingAlert = false
    var body: some View {
        HStack {
            Text("Click me")
            Spacer()
        }
        //.background(.green)
        .padding()
        .contentShape(Rectangle())
        .onTapGesture {
            showingAlert.toggle()
        }
        .alert(isPresented: $showingAlert) {
            Alert(title: Text("Hello there!"))
        }
    }
}

ただ、From内だとNavigationLink使ってないせいかframe指定もしないとだめだった。
しかし、background指定したりいろいろやってからframe指定外したらちゃんと反応する様になって再現できなくなった。
ここら辺はXcodeとかの不具合かもしれない。

struct ContentView: View {
    @State var showingAlert = false
    var body: some View {
        Form {
            HStack {
                Text("Click me")
                Spacer()
            }
            //.background(.green)
            //.frame(maxWidth: .infinity)
            .contentShape(Rectangle())
            .onTapGesture {
                showingAlert.toggle()
            }
        }
        .alert(isPresented: $showingAlert) {
            Alert(title: Text("Hello there!"))
        }
        .padding()
    }
}

NavigationLink使うとcontentShapeはいらいな。

struct ContentView: View {
    var body: some View {
        NavigationStack {
            Form {
                NavigationLink {
                    AlertView()
                } label: {
                    HStack {
                        Text("Click me")
                        Spacer()
                    }
                }
            }
            .padding()
        }
    }
}

参照

Apple Developer Documentation

swiftui - NavigationLink contentShape not working without adding a background color - Stack Overflow

ios - Swiftui How can you use on Tap Gesture for entire row in a foreach loop - Stack Overflow