1

This is how my tabView looks like. I want the views to have a page feel thats why I'm using PageTabViewStyle, but I don't want the page to be scrollable on users swipe.

How can I disable just the horizontal swipe/drag on the views?```

TabView(selection: $tabIndex){

                PasswordCardView(tabIndex: $tabIndex,
                                 fieldType: $fieldType,
                                 shouldClearPasswords: $shouldClearPasswords,
                                 isHorizontalDrag: $isHorizontalDrag)
                .padding(EdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10))
                .tag(0)
                .contentShape(Rectangle())
         
                
                
                UserNameCardView(tabIndex: $tabIndex,
                                 fieldType: $fieldType)
                .padding(EdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10))
                .tag(1)
                .contentShape(Rectangle())
                
                BirthdayCardView(tabIndex: $tabIndex,
                                 fieldType: $fieldType,
                                 tapGesturePerformed: $tapGesturePerformed,
                                 isHorizontalDrag: $isHorizontalDrag)
                .padding(EdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10))
                .tag(2)
                .contentShape(Rectangle())
                
                GenderCardView(tabIndex: $tabIndex,
                               fieldType: $fieldType,
                               tapGesturePerformed: $tapGesturePerformed)
                .padding(EdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10))
                .tag(3)
                .contentShape(Rectangle())
                
                LocationCardView(tabIndex: $tabIndex,
                                 fieldType: $fieldType,
                                 isSignUpShown: $isSignUpShown)
                .padding(EdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10))
                .tag(4)
                .contentShape(Rectangle())
                
                NewsletterCardView(tabIndex: $tabIndex,
                                   fieldType: $fieldType)
                .padding(EdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10))
                .tag(5)
                .contentShape(Rectangle())
                
                ActivationCardView(tabIndex: $tabIndex,
                                   fieldType: $fieldType,
                                   dismissSignup: $dismissSignup)
                .padding(EdgeInsets(top: 0, leading: 10, bottom: 0, trailing: 10))
                .tag(6)
                .contentShape(Rectangle())
            }
        .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))





I've tried making the x offset to 0, but that unhooks the tabview's vertical scrolling with the entire view's scrolling. That is on vertical swiping the tabview, it hides being the other views in parent view.

I've tried to remove the dragGesture() if the drag is horizontal:-
.gesture(isHorizontalDrag ? DragGesture() : nil)

but that also doesn't work everytime, by the time the gesture gets recognised, the gesture is already set in tabView
sukanya agarwal
  • 41
  • 7

1 Answers1

1

I eventually had to go with the 3rd party library called introspect to get this to work. That allows us to stop scrolling in a single direction.

sukanya agarwal
  • 41
  • 7