개발/Swift
[SwiftUI] ScrollViewReader & ScrollViewProxy | 스크롤뷰 리더, 프록시
leebaek
2023. 11. 8. 20:00
■ ScrollViewReader
■ ScrollViewProxy
■ ScrollViewReader
: 하위 뷰로 스크롤하기 위해 프록시와 작업하여 프로그래밍 방식 스크롤을 제공하는 뷰
@frozen
struct ScrollViewReader<Content> where Content : View
- 내부에서 생성된 작업만 제스처 핸들러나 뷰의 메서드와 같은 프록시를 호출할 수 있음
■ ScrollViewProxy
: 뷰 계층 구조 내에서 스크롤 가능한 뷰의 프로그래밍 방식 스크롤을 지원하는 프록시 값
struct ScrollViewProxy
- ScrollViewProxy 인스턴스를 직접 생성하지 않고, ScrollViewReader의 뷰 빌더에서 인스턴스를 받음
- 버튼, 제스처 핸들러 또는 onChange() method와 같은 작업을 사용하여 프록시의 scrollTo() method를 호출함
-id에 저장된 객체로 스크롤 뷰 이동
withAnimation {
proxy.scrollTo(bottomID)
}
ex.
- Scroll to Bottom을 누르면 스크롤 뷰 아래로 이동
- Top을 누르면 스크롤뷰 위로 이동
@Namespace var topID // 스크롤 뷰 위의 프로퍼티를 포함하는 객체의 id
@Namespace var bottomID // 스크롤 뷰 아래의 프로퍼티를 포함하는 객체의 id
var body: some View {
ScrollViewReader { proxy in
ScrollView {
Button("Scroll to Bottom") {
withAnimation {
proxy.scrollTo(bottomID) // 버튼 클릭시 bottom으로 스크롤 뷰 이동
}
}
.id(topID)
VStack(spacing: 0) {
ForEach(0..<100) { i in
Text("\(i)")
}
}
Button("Top") {
withAnimation {
proxy.scrollTo(topID) // 버튼 클릭시 top으로 스크롤 뷰 이동
}
}
.id(bottomID)
}
}
}
.id(topID) // topID에 해당 객체 저장
.id(BottomID) // BottomID에 해당 객체 저장