如何使用 SwiftUI 在 TabView 中禁用垂直滚动？答案

【问题标题】：How to disable vertical scroll in TabView with SwiftUI?如何使用 SwiftUI 在 TabView 中禁用垂直滚动？
【发布时间】：2021-01-13 09:37:04
【问题描述】：

我在我的应用程序中设置了一个 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))
    }
  }
}

【问题讨论】：

看起来像一个错误或目前无法更改的东西。题外话：但如果您将 currentTabIndex 指定为 Double，您也必须在标签中使用 Double。

标签： swift swiftui tabview

【解决方案1】：

我遇到了同样的问题。这不是一个精确的解决方案，但您可以关闭滚动视图的弹跳（在 TabView 中使用）。只要 TabView 中的项目不大于 TabView 框架，它就应该像禁用垂直滚动一样。

我会将它称为 .onAppear 或在您的 init 函数中：

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

注意：这会禁用您应用中所有滚动视图的弹跳...因此您可能需要重新启用它 .onDisappear。

【讨论】：

谢谢！在我的情况下，内容肯定比 TabView 框架小，所以你对它为什么会滚动有任何了解吗？
我也希望它没有哈哈。似乎每个选项卡都基于一个 ScrollView，这可能是为了在内容大于 TabView 框架的情况下，用户可以在其上滚动（只是我的猜测，idrk）。
还有其他解决方案吗？我想保留弹跳功能，但只停用 tabview 的垂直滚动功能
@Erik 我还没有找到任何其他本地解决方案，但是，我已经使用了这个SwiftUI Pager project（不附属）而不是分页选项卡视图，它工作得很好。

【解决方案2】：

Xcode 12.4 仍然存在问题。

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

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

【讨论】：

UIScrollView.appearance().bounces = false 和 UIScrollView.appearance().bounces = true 对我有用。