如何使用SwiftUI在TabView中禁用垂直滚动?

时间:2020-09-27 17:35:46

标签: swift swiftui tabview

我已经在应用程序中设置了TabView,以便可以在多个页面之间水平滑动,但是我也可能会出现不必要的垂直滚动,从而产生反弹效果。如何禁用此垂直滚动?

我的代码:


struct ContentView: View {
  @State private var currentTabIndex: Double = 0

  var body: some View {
    VStack {
      TabView(selection: $currentTabIndex) {
        Text("Text n°1")
          .tag(0)
        
        Text("Text n°2")
          .tag(1)
      }
      .border(Color.black)
      .tabViewStyle(PageTabViewStyle(indexDisplayMode: .never))
    }
  }
}

2 个答案:

答案 0 :(得分:4)

Xcode 12.4 仍然存在问题。

我设法通过将 TabView 包装在 ScrollView 中并使用 alwaysBounceVertical 属性设置为 false 来解决该问题,如下所示:

ScrollView(.horizontal) {
    TabView {
        ///your content goes here
    }
    .tabViewStyle(PageTabViewStyle())
}
.onAppear(perform: {
    UIScrollView.appearance().alwaysBounceVertical = false
})
.onDisappear(perform: {
    UIScrollView.appearance().alwaysBounceVertical = true
})

答案 1 :(得分:2)

我有同样的问题。这不是一个确切的解决方案,但是您可以关闭在滚动视图(在TabView中使用)的弹跳功能。只要TabView中的项目不大于TabView框架,它的作用就好像您禁用了垂直滚动。

我会在.onAppear或您的init函数中称其为

.onAppear(perform: {
   UIScrollView.appearance().bounces = false
 })

注意:这将禁用应用程序中所有滚动视图的弹跳功能。因此,您可能需要重新启用.onDisappear。