标签: swiftui-scrollview

XCode 版本 12.4 (12D4e)

每次在 ScrollView 中实现 Lazy 堆栈时，我都会遇到这个问题：

1. 添加 aLazyHStack到水平ScrollView或 aLazyVStack到垂直ScrollView
2. 添加足够的内容，使滚动视图的内容大小超出其边界

场景 1 - 将滚动视图拉出边界（就像拉动以刷新）

预期行为：当滚动视图停留在您的手指下时，它的行为与预期一致

观察到的行为：它口吃和跳跃

场景 2 - 快速滚动到边缘，使其必须弹跳

预期行为：弹跳顺畅

观察到的行为：到达边缘时停止并抖动，但不反弹

我的理论 我的理论是，由于使用了 Lazy 堆栈，当视图离开屏幕时，它会从视图层次结构中移除，从而造成卡顿。

我想知道有没有其他人遇到过这种情况？这是 SwiftUI 中的错误吗？几个月来，我已经在不同的项目中可靠地重现了这一点，但最终还是不使用我希望可以使用的 Lazy 堆栈。

示例代码

        ScrollView {
          LazyVStack {
            ForEach(viewModel.items) { items in
              SomeView(viewModel: .init(context: viewModel.context, item: item))
            }
          }

注意：口吃只发生在滚动视图的顶部

** 2021 年 7 月 10 日更新**

这仍然发生在 iOS 15 版本 13.0 测试版 (13A5155e) 中。

在下面的视频中，注意滚动条的行为和到达底部时的卡顿：

https://youtu.be/z2pybl5yYqk …

所以我尝试使用 ScrollViewReader 以编程方式滚动水平滚动视图。我认为它会像 UIKit 中带有 .centeredHorizo​​ntally 的scrollToItem一样工作，并且在大多数情况下都是如此，但是滚动视图中的最后几个元素被强制滚动到屏幕中心，尽管事实上滚动视图是“通常无法滚动那么远（至少在释放拖动后不会快速返回）。这最终会在屏幕的后半部分创建空白区域。

我已经看到了一些关于此的其他问题，似乎普遍的意见是这不是一个错误？一方面，我想我们告诉滚动视图将项目居中，而它正是这样做的——所以，这不是一个错误吗？另一方面，类似的功能在 UIKit 中并不是这样工作的。此外，这种行为仅发生在滚动视图的尾端！如果这是预期的行为，我希望使用 .center 锚点滚动到滚动视图中的第一个元素将迫使其进入屏幕中心并留下前导空白，但这不会发生。

有一个优雅的解决方案吗？或者我们是否必须计算元素的宽度 + 间距，并根据屏幕宽度计算出是否应该锚定 .center 或只是滚动到带有锚点 .trailing 的最后一个元素，以便复制 UIKit 行为？

我正在尝试创建一个像苹果的一些应用程序一样的轮播。具有TabView分页样式，但它不会“查看”上一个和下一个元素。不会ScrollView(.horizontal)折断。我希望将这两种行为结合起来，而无需重写客户视图。这两种观点中的任何一种都可能发生这样的事情吗：

这就是我正在尝试的：

ScrollView(.horizontal, showsIndicators: false) {
    HStack(alignment: .center, spacing: 0) {
        GroupBox(label: Text("This is the title 1")) {
            Label("Some item 1", systemImage: "checkmark.circle.fill")
            Label("Some item 2", systemImage: "checkmark.circle.fill")
            Label("Some item 3", systemImage: "checkmark.circle.fill")
            Label("Some item 4", systemImage: "checkmark.circle.fill")
        }
        .padding()
        GroupBox(label: Text("This is the title 2")) {
            Label("Some item 1", systemImage: "checkmark.circle.fill")
            Label("Some item 2", systemImage: "checkmark.circle.fill")
            Label("Some item 3", systemImage: "checkmark.circle.fill")
            Label("Some item 4", systemImage: "checkmark.circle.fill")
        }
        .padding()
        GroupBox(label: Text("This is the title 3")) { …

ScrollView当内容足够小以至于不需要滚动时，我试图让 a 中的内容居中，而是与顶部对齐。这是一个错误还是我遗漏了添加一些东西？使用Xcode11.4 (11E146)

    @State private var count : Int = 100

    var body : some View {
//        VStack {
            ScrollView {
                VStack {
                    Button(action: {
                        if self.count > 99 {
                            self.count = 5
                        } else {
                            self.count = 100
                        }
                    }) {
                        Text("CLICK")
                    }
                    ForEach(0...count, id: \.self) { no in
                        Text("entry: \(no)")
                    }
                }
                .padding(8)
                .border(Color.red)
                .frame(alignment: .center)
            }
            .border(Color.blue)
            .padding(8)
//        }
    }

我正在创建一个应用程序，在分页视图中呈现数据，每个视图都包含一个由scrollView启用的垂直可滚动列表。我还使用scrollViewReader 能够以编程方式滚动到列表中的特定位置。在大多数情况下，这工作正常，但是当我以编程方式滚动到列表底部（到最后一项）时，它滚动得太远。

我隔离了一个可重复的案例：

ScrollView(.vertical, showsIndicators: false) {
    ScrollViewReader { scrollView in
        LazyVStack(alignment: .leading) {
            ForEach((1..<100) , id:\.self) { key in
                Text("Hello \(key)")
            }
            
        }
        .onAppear {
            DispatchQueue.main.asyncAfter(deadline: .now() + 0.5) {
                withAnimation {
                    scrollView.scrollTo(99, anchor: .center)
                    
                }
            }
            
        }
    }
}

如果您在 iPhone 12 模拟器等设备上运行此命令，您将看到列表中的最后一项位于屏幕中间。如果您手动滚动并释放，列表将“落下”到屏幕底部，这是我希望列表所在的位置，即使我使用 滚动到最后一个项目.anchor: .center。

有办法解决这种行为吗？

编辑：意识到我还不够清楚。只要我的视图中有更多可滚动内容，我希望锚点为 .center。但是，当我到达列表底部时，我希望滚动视图足够智能，知道无法再滚动。现在，它的滚动次数比手动滚动的滚动次数要多。

我做了一个自定义导航栏。并在其下方添加了滚动视图。我遇到的问题是，当我向下滚动时，滚动视图内的数据会出现在导航栏上。这是屏幕截图：

struct NewsfeedView: View {
    
    var newsfeedModel: [NewsFeedData]
    
    var body: some View {
        
        VStack {
            
            CustomNavBar(navTitle: "Newsfeed")
            
            ScrollView {
                LazyVStack{
                    ForEach(newsfeedModel) { modelData in
                         
                        NewsFeedTableViewCell(newsFedd: modelData)
          }
        }
      }
    }.ignoresSafeArea()
  }
}