화면을 초과할 때에만 스크롤 허용하기

유호준·2022년 4월 21일
0
post-thumbnail

NavigationView 내부에 Form을 넣어 사용하던 도중 키보드가 내려가지 않은 상태로 NavigationLink를 통해 다음 화면으로 가게되면 화면이 자기 맘대로 dismiss되어 버리는 현상이 생겨 수정을 하게 되었다.

수정을 최대한 동일하게 해보고 싶었기에, Form, List처럼 화면을 초과할 때만 스크롤을 할 수 있도록 만들어보고 싶었고 정리해봤다.


 @State private var scrollAxis: Axis.Set = .vertical
 @State private var scrollHeight = 0.0
 @State private var vstackHeight = 0.0
    
 GeometryReader{scrollProxy in
	ScrollView(scrollAxis, showsIndicators: false){
    	VStack{...}
		.background(
			GeometryReader{vstackProxy in
				Color.clear.onAppear{
					vstackHeight = vstackProxy.size.height
				}.onChange(of: scrollProxy.size.height){
					//vstack이 가려졌을 때만 스크롤
					scrollAxis = vstackProxy.size.height > $0 ? .vertical : []
				}})
}

간단히 GeometryReader ScrollView, VStack의 높이를 구한다. 그 후 ScrollView의 높이VStack보다 작다면 스크롤이 가능하도록 scrollAxisvertical, 아니라면 빈 List를 넣어주면 된다.

이때 주의할 점은 scrollAxis의 초기값은 vertical이어야 VStack의 높이를 정확히 구할 수 있다.

추가적으로 Viewdisable시켜버리면 내부 View와의 interaction이 모두 막히기 때문에 스크롤을 막기 위해서는 위같이 scrollAxis를 변경해주어야 한다.

참고
https://stackoverflow.com/questions/62463142/swiftui-make-scrollview-scrollable-only-if-it-exceeds-the-height-of-the-screen

0개의 댓글