Handling taps with onTapGesture

A view does not have to look like a button to respond to a tap. onTapGesture attaches an action directly to a view, with options for recognizing repeated taps.

onTapGesture

The supplied closure runs when SwiftUI recognizes the gesture. Unlike a standard button style, attaching a tap gesture does not automatically add a pressed-state highlight.

struct TapGestureStudy: View {
    
    @State var isSelected: Bool = false
    
    var body: some View {
        VStack(spacing: 40){
            RoundedRectangle(cornerRadius: 32)
                .foregroundColor(isSelected ? .green : .yellow)
                .frame(height: 200)
            // Default button
            Button {
                isSelected.toggle()
            } label: {
                Text("Button")
                    .foregroundColor(.white)
                    .frame(height: 50)
                    .frame(maxWidth: .infinity)
                    .background(Color.blue)
                    .cornerRadius(25)
            }
            // Text styled as a button
            Text("Tap Gesture")
                .foregroundColor(.white)
                .frame(height: 50)
                .frame(maxWidth: .infinity)
                .background(Color.blue)
                .cornerRadius(25)
                // Run when the tap is recognized
                .onTapGesture {
                    isSelected.toggle()
                }
        }
        .padding()
    }
}

Tap count

Set count to the number of consecutive taps required before the action runs.

struct TapGestureStudy: View {
    
    @State var isSelected: Bool = false
    
    var body: some View {
        VStack(spacing: 40){
            RoundedRectangle(cornerRadius: 32)
                .foregroundColor(isSelected ? .green : .yellow)
                .frame(height: 200)
            Text("Tap Gesture")
                .foregroundColor(.white)
                .frame(height: 50)
                .frame(maxWidth: .infinity)
                .background(Color.blue)
                .cornerRadius(25)
                // Run after three consecutive taps
                .onTapGesture(count: 3) {
                    isSelected.toggle()
                }
        }
        .padding()
    }
}