[SwiftUI]ScrollViewを一番上までスクロールするには？

どうも、ちょげ(@chogetarou)です。

ScrollViewを一番上までスクロールする方法を紹介します。

方法

ScrollViewを一番上までスクロールするには、ScrollViewReaderを使います。

まず、ScrollViewをScrollViewReaderで囲みます

ScrollViewReader { reader in
    ScrollView {
        //View
    }
}

次に、ScrollViewの１番上の要素に、idを付与します。

TopView()
    .id(id)

最後に、ScrollViewReaderの引数からscrollToメソッドを呼び出します。

scrollToメソッドの引数には、１番上の要素のidを指定します。

reader.scrollTo(id)

withAnimation (.default){
    reader.scrollTo(id)
}

使用例

struct ContentView: View {
    
    var body: some View {
        ScrollViewReader { reader in
            VStack {
                Button("Scroll To Top") {
                    withAnimation (.easeInOut){
                        reader.scrollTo(0)
                    }
                }
                
                ScrollView {
                    Text("First Item")
                        .foregroundColor(.red)
                        .font(.title)
                        .padding()
                        .id(0)
                    
                    ForEach(1..<30) { index in
                        Text("Item \(index)")
                            .padding()
                    }
                }
            }
        }
    }
}