SwiftUI 코드로 맨 아래로 자동 스크롤
htps : // 코 m / 조코 야마 / ms / b775 80 445d81d33814
제 경우에는 코드에서 자동으로 (사용자 조작없이) 맨 아래로 스크롤하도록 고민했습니다.
찾아도 좀처럼 걸리지 않았기 때문에 검색의 도움이 되면 다행입니다.
코드로 스크롤하는 방법
코드로 스크롤하려면 ScrollViewReader
와 scrollTo
를 사용합니다.
타이밍을 자유롭게 제어하기 위해 onChange
도 사용합니다.
이미지.swiftScrollViewReader {
...
ScrollView {} // ここにスクロールさせたい View を挟む
...
.onChange() {
.scrollTo()
}
}
코드 예
포인트
ScrollViewReader {
...
ScrollView {} // ここにスクロールさせたい View を挟む
...
.onChange() {
.scrollTo()
}
}
포인트
View 에 @StateObject
@StateObject var xxx = XXX()
클래스 XXX 안에 @Published 변수 scrollID를 가져 가라.
@Published var scrollID: Int = 0
스크롤하여 표시하고 싶은 View에 id (...)를 붙여 둡니다.
id(999)
스크롤하는 View 본체(ScrollView)에 .onChange(...) 를 붙여 둔다.
.onChange(of: xxx.scrollID) { id in ... }
ScrollView를 ScrollViewReader {...} 사이에 끼웁니다.
ScrollViewReader { proxy in ... }
onChange(...) 안에 scrollTo(...) 쓰기
proxy.scrollTo(id)
scrollID가 변경되면 자동으로 스크롤
self.scrollID = 999
Sample.swift
import SwiftUI
struct ContentView: View {
@StateObject var xxx = XXX()
var body: some View {
ScrollViewReader { proxy in
ScrollView {
VStack {
Text("A")
Text("B")
Text("C")
Text("D")
Text("E")
Text("F")
Text("G")
Text("H")
Text("I")
Text("J").id(999)
}
.onAppear {
// 表示されたことを xxx に知らせる
self.xxx.onAppear()
}
}
.onChange(of: xxx.scrollID) { id in
withAnimation {
proxy.scrollTo(id)
}
}
}
}
}
class XXX: ObservableObject {
@Published var scrollID: Int = 0
func onAppear() {
// 表示された 3 秒後に scrollID を 999 に変更する
DispatchQueue.main.asyncAfter(deadline: .now() + 3) {
self.scrollID = 999
}
}
}
※ 처음의 동영상에서는 이 코드에 더해, 알기 쉽게 하기 위해서 색을 붙이거나 높이를 조정하고 있습니다.
덤
withAnimation { ... }
를 쓰지 않으면 애니메이션 없이 순식간에 스크롤할 수 있습니다. scrollTo(id)
대신 scrollTo(id, anchor: ...)
를 사용하면 스크롤한 후 View의 위치를 세밀하게 조정할 수 있습니다. 이상입니다.
고마워요.
Reference
이 문제에 관하여(SwiftUI 코드로 맨 아래로 자동 스크롤), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/Rubydog/items/a6ef62fe8d0630f84b2e텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)