본문 바로가기
Dev/iOS

[SwiftUI] Custom PageView 사용하기

by steady.dev 2021. 8. 16.

PageTabViewStyle 은 iOS 14.0 이상 부터 사용가능하다.

1. iOS 14이상

Custom 하게 사용할 PageView를 작성한 후

struct PageView<SelectionValue, Content>: View where SelectionValue: Hashable, Content: View {
    @Binding private var selection: SelectionValue
    private let indexDisplayMode: PageTabViewStyle.IndexDisplayMode
    private let indexBackgroundDisplayMode: PageIndexViewStyle.BackgroundDisplayMode
    private let content: () -> Content

    init(
        selection: Binding<SelectionValue>,
        indexDisplayMode: PageTabViewStyle.IndexDisplayMode = .automatic,
        indexBackgroundDisplayMode: PageIndexViewStyle.BackgroundDisplayMode = .automatic,
        @ViewBuilder content: @escaping () -> Content
    ) {
        self._selection = selection
        self.indexDisplayMode = indexDisplayMode
        self.indexBackgroundDisplayMode = indexBackgroundDisplayMode
        self.content = content
    }

    var body: some View {
        TabView(selection: $selection) {
            content()
        }
        .tabViewStyle(PageTabViewStyle(indexDisplayMode: indexDisplayMode))
        .indexViewStyle(PageIndexViewStyle(backgroundDisplayMode: indexBackgroundDisplayMode))
    }
}

extension PageView where SelectionValue == Int {
    init(
        indexDisplayMode: PageTabViewStyle.IndexDisplayMode = .automatic,
        indexBackgroundDisplayMode: PageIndexViewStyle.BackgroundDisplayMode = .automatic,
        @ViewBuilder content: @escaping () -> Content
    ) {
        self._selection = .constant(0)
        self.indexDisplayMode = indexDisplayMode
        self.indexBackgroundDisplayMode = indexBackgroundDisplayMode
        self.content = content
    }
}

아래와 같이 Custom PageView를 사용한다.

PageView(selection: $selection, indexBackgroundDisplayMode: .always) {
  AView()
  BView()
}

출처 : https://stackoverflow.com/questions/58388071/how-can-i-implement-pageview-in-swiftui/63159912

 

How can I implement PageView in SwiftUI?

I am new to SwiftUI. I have three views and I want them in a PageView. I want to move each Views by swipe like a pageview and I want the little dots to indicate in which view I'm in.

stackoverflow.com

 

2. iOS 13 이상

https://github.com/fredyshox/PageView

 

GitHub - fredyshox/PageView: SwiftUI view enabling navigation between pages of content, imitating the behaviour of UIPageViewCon

SwiftUI view enabling navigation between pages of content, imitating the behaviour of UIPageViewController for iOS and watchOS - GitHub - fredyshox/PageView: SwiftUI view enabling navigation betwee...

github.com

를 이요해서 PageView의 Source 폴더내의 파일들을 프로젝트내 추가해서 아래와 같이 사용한다.

HPageView(selectedPage: $selection) {
	AView()
	BView()
}

댓글