将 ScrollView 位置重置到页面顶部

时间:2021-06-05 20:01:04

标签: swiftui swiftui-scrollview

当视图出现时(例如,当您从导航链接返回时),我试图将滚动条重置到页面顶部。 ScrollView 嵌入在带有大标题的 NavigationView 中。

使用下面的代码,我可以使用 ScrollViewReaderscrollTo 将滚动重置为页面上的第一个元素。

但是,我希望视图一直滚动到顶部,以便重新出现大导航栏标题。相反,我只看到内联标题。

是否有更好的方法来重置滚动条以转到页面的最顶部并显示大导航栏标题?

import SwiftUI

struct ContentView: View {
    
    var body: some View {
        NavigationView {
            ScrollView {
                ScrollViewReader { value in
                    ForEach(0..<10) { i in
                        HStack {
                            Spacer()
                            NavigationLink(destination: Text("Destination"), label: { Text("\(i)") })
                                .padding(.bottom, 100)
                            Spacer()
                        }
                        .id(i)
                    }
                    .onAppear() {
                        value.scrollTo(0)
                    }
                }
            }
            .navigationBarTitle("Scroll Test")
        }
    }
}

1 个答案:

答案 0 :(得分:0)

目前 api 不允许这样的功能。希望下周能改变这种情况。

与此同时,您可以实施此解决方法:https://developer.apple.com/forums/thread/127737

它的工作原理是通过清除数据强制视图重绘。

为了让您的示例工作,您必须

  1. 创建一个 @State 变量,如

@State var data = Array(0..<10)

  1. 将您的 ForEach 替换为

ForEach(data, id: \.self)

  1. onAppear
  2. 中更改您的代码

.onAppear {
    data = []
    DispatchQueue.main.asyncAfter(deadline: .now() + 0.01) {
        data = Array(1..<10)
    }