CODEWITHSUNDEEP
swiftui
TiN
TiN

Reputation: 389

SwiftUI Buttons in a ScrollView is not tappable sometimes

I have a horizontal ScrollView on top of a MapView.

The ScorllView is a collection of Buttons. It is weird that the buttons in the ScrollView are sometime tapable and sometimes not. First tap always works but after that I have to scroll a bit, tap around different areas in the button, make some secret prayers and then it works!

I tried disabling/removing all other components in the view, but still unable to figure out the root cause.

Has anyone experience this ?

Upvotes: 13

Views: 6187

Answers (5)

Mojtaba Hosseini
Mojtaba Hosseini

Reputation: 119468

This is the default behavior of UIScrollView. You can disable it by running this code somewhere like inside init or .onAppear modifier:

UIScrollView.appearance().delaysContentTouches = false

⚠️ Note that this will be applied on all scrollViews. You may want to make it true again if you like the default behavior back.

Upvotes: 0

hidden-username
hidden-username

Reputation: 2697

One issue with the accepted answer is that it breaks ColorPicker's presentation if you also have a ColorPicker in the ScrollView. Solution, use .simultaneousGesture(DragGesture()) instead.

ScrollView {
  HStack {
    Button("A") {}
    ColorPicker("Color", selection: .constant(.red))
  }
}
.simultaneousGesture(DragGesture())

Upvotes: 0

user3172100
user3172100

Reputation: 27

To anyone else having this issue, instead of adding an empty .onTapGesture view modifier, check that any HStacks in the ScrollView hierarchy have a .contentShape(Rectangle()) modifier. By default, HStacks don't accept taps in between their child views, and depending on your child view's layout this can cause taps to be missed even when it looks like they should be landing. .contentShape(Rectangle()) makes the entire frame of the HStack tappable.

Upvotes: 0

Kasun Udara Jayasekara
Kasun Udara Jayasekara

Reputation: 461

I also faced the same issue for Horizontal Scroll view in Swiftui dark theme "CameraTimerItem" buttons not clickable (Problem with dark theme only). Then I put a onTapGesture without any action. It's starts to work normally. I think it's a error of SwiftUI.

       VStack (alignment:.center){
                        ScrollView(.horizontal, showsIndicators: false) {
                            HStack{
                                ForEach(timeSlots,id: \.self) { item in
                                    CameraTimerItem(cellTitle: item)
                                }
                            }
                            .frame(width: AppUtils.width, alignment: .center)
                        }
                        .onTapGesture {
                           // <---- This is the solution 
                        }
                    }

Upvotes: -1

Eugene Vaganov
Eugene Vaganov

Reputation: 643

I stuck with a same issue with horizontal ScrollView on top and List. While debugging I added empty .onTapGesture to ScrollView and it somehow fix my issue.

VStack(spacing: 0) {
    ScrollView(.horizontal) {
        HStack {
            Button("one") {}
            Button("two") {}
            Button("three") {}
        }
    }
    .onTapGesture { // <---- fix
    }
    List {
    }
}

Upvotes: 38

Related Questions