[SwiftUI] 스크롤 뷰 ScrollView 페이징 Page 화면 구현하기

아이폰을 개발하다보면 스크롤 뷰를 많이 사용합니다. 제한된 영역에서 넓은 화면을 구현하기 위해서 입니다. 오토레이아웃을 사용할 경우 스크롤 뷰를 구현하기가 조금 까다롭습니다. Xcode가 버전업 되면서 현재는 ContentView와 FrameView에 오토레아이웃을 걸고 사용합니다. 하지만 SwiftUI 에서는 아주 쉽게 스크롤 뷰를 만들수 있습니다. 대신 조금 낮설긴합니다.

 

GeometryReader를 이용해서 3개의 화면을 만들고 스크롤 뷰로 페이징하는 방법을 알아보겠습니다.

 

 스크롤 뷰로 페이지 뷰 만들기 

 

SwiftUI 페이징 처리

---

 

 

 

▼ 아래 코드를 이용해서 페이징 처리가 가능합니다.

1. colors 변수로 화면에 포함될 색상을 배열로 만듭니다.
2. GeometryReader의 proxy 속성으로 각 화면의 화면 크기를 구합니다.
3. .horizontal 타입의 ScrollView를 생성합니다.
4. ForEach구문을 이용해서 HStack에 3개의 화면을 만들어줍니다.
5. 마지막으로 onAppear 구문에서 스크롤뷰의 속성인 isPagingEnabled 값을 true로 변경해줍니다.

스크롤 뷰의 isPagingEnabled 속성

---