Create a Custom PDF Page Setting View in SwiftUI for iOS

1
//
2
//  Copyright © 2020-2025 PSPDFKit GmbH. All rights reserved.
3
//
4
//  The Nutrient sample applications are licensed with a modified BSD license.
5
//  Please see License for details. This notice may not be removed from this file.
6
//
7

8
import Combine
9
import PSPDFKit
10
import PSPDFKitUI
11
import SwiftUI
12

13
class SwiftUISettingsExample: Example {
14

15
    override init() {
16
        super.init()
17

18
        title = "SwiftUI Settings Example"
19
        contentDescription = "Shows how to show a PDFViewController in SwiftUI with Settings."
20
        category = .swiftUI
21
        priority = 11
22
    }
23

24
    override func invoke(with delegate: ExampleRunnerDelegate) -> UIViewController? {
25
        let document = AssetLoader.writableDocument(for: .welcome, overrideIfExists: false)
26
        let swiftUIView = SwiftUISettingsExampleView(store: SwiftUISettingsExampleViewModel(document: document))
27
        return UIHostingController(rootView: swiftUIView, largeTitleDisplayMode: .never)
28
    }
29
}
30

31
class SwiftUISettingsExampleViewModel: ObservableObject {
32
    @Published var document: Document
33

34
    init(document: Document) {
35
        self.document = document
36
    }
37
}
38

39
private struct SwiftUISettingsExampleView: View {
40
    @ObservedObject var store: SwiftUISettingsExampleViewModel
41
    @State private var scrollDirection = ScrollDirection.horizontal
42
    @State private var pageTransition = PageTransition.scrollPerSpread
43
    @State private var pageIndex = PageIndex(0)
44
    @PDFView.Scope private var scope
45

46
    var body: some View {
47
        return VStack(alignment: .center) {
48
            // UIStepper is not allowed for Catalyst Mac Idiom.
49
            if !UIDevice.current.isCatalystMacIdiom {
50
                Stepper("Current Page: \(pageIndex + 1)", value: $pageIndex, in: 0...store.document.pageCount - 1)
51
                .padding()
52
            }
53

54
            SettingsView(scrollDirection: $scrollDirection, pageTransition: $pageTransition)
55
                .padding()
56

57
            Button("Toggle Document") {
58
                if store.document.title == "Magazine" {
59
                    store.document = AssetLoader.writableDocument(for: .welcome, overrideIfExists: false)
60
                } else {
61
                    store.document = AssetLoader.writableDocument(for: .magazine, overrideIfExists: false)
62
                }
63
            }
64

65
            PDFView(document: store.document, pageIndex: $pageIndex)
66
                .scrollDirection(scrollDirection)
67
                .pageTransition(pageTransition)
68
                .pageMode(.single)
69
                .userInterfaceViewMode(.always)
70
                .spreadFitting(.adaptive)
71
                .showDocumentTitle()
72
                .toolbar {
73
                    DefaultToolbarButtons()
74
                }
75
                .pdfViewScope(scope)
76
        }
77
    }
78
}
79

80
// MARK: Settings Logic
81

82
extension ScrollDirection: LocalizableIterable {
83
    var localizedName: LocalizedStringKey {
84
        switch self {
85
        case .horizontal: return "Horizontal"
86
        case .vertical: return "Vertical"
87
        }
88
    }
89

90
    static var allCases: [Self] {
91
        [.horizontal, .vertical]
92
    }
93
}
94

95
extension PageTransition: LocalizableIterable {
96
    var localizedName: LocalizedStringKey {
97
        switch self {
98
        case .scrollPerSpread: return "Scroll per Spread"
99
        case .scrollContinuous: return "Scroll Continuous"
100
        case .curl: return "Page Curl"
101
        }
102
    }
103

104
    static var allCases: [Self] {
105
        [.scrollPerSpread, .scrollContinuous, .curl]
106
    }
107
}
108

109
struct NamedPicker<EnumType>: View where EnumType: Hashable & LocalizableIterable,
110
                                         EnumType.AllCases: RandomAccessCollection {
111
    let title: String
112
    @Binding var value: EnumType
113
    @Environment(\.horizontalSizeClass) var horizontalSizeClass
114

115
    var body: some View {
116
        VStack {
117
            Text(title)
118
            Picker(selection: $value, label: Text(title)) {
119
                ForEach(EnumType.allCases, id: \EnumType.self) { value in
120
                    Text(value.localizedName).tag(value)
121
                }
122
            }.pickerStyle(SegmentedPickerStyle())
123
        }
124
    }
125
}
126

127
struct SettingsView: View {
128
    @Binding var scrollDirection: ScrollDirection
129
    @Binding var pageTransition: PageTransition
130

131
    var body: some View {
132
        AdaptiveStack {
133
            NamedPicker(title: "Scroll Direction", value: $scrollDirection)
134
            NamedPicker(title: "Page Transition", value: $pageTransition)
135
        }
136
    }
137
}
138

139
// MARK: Previews
140

141
struct SwiftUISettinsExamplePreviews: PreviewProvider {
142
    static var previews: some View {
143
        let document = AssetLoader.document(for: .welcome)
144
        SwiftUISettingsExampleView(store: SwiftUISettingsExampleViewModel(document: document))
145
    }
146
}