SwiftUI Split Screen: Display Two PDF Views Side by Side on iOS

1
//
2
//  Copyright © 2019-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 PSPDFKit
9
import PSPDFKitUI
10
import SwiftUI
11

12
class SwiftUISplitScreenExample: Example {
13

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

17
        title = "SwiftUI Split-Screen Example"
18
        contentDescription = "Shows how to show two PDFViews in SwiftUI side by side."
19
        category = .swiftUI
20
        priority = 13
21
    }
22

23
    override func invoke(with delegate: ExampleRunnerDelegate) -> UIViewController? {
24
        let leadingDocument = AssetLoader.writableDocument(for: .welcome, overrideIfExists: false)
25
        let trailingDocument = AssetLoader.writableDocument(for: .annualReport, overrideIfExists: false)
26
        let swiftUIView = SwiftUISplitScreenExampleView(leadingDocument: leadingDocument, trailingDocument: trailingDocument)
27
        let hostingController = UIHostingController(rootView: swiftUIView, largeTitleDisplayMode: .never)
28
        hostingController.title = "SwiftUI SplitScreen Example"
29

30
        return hostingController
31
    }
32
}
33

34
private struct SwiftUISplitScreenExampleView: View {
35
    let leadingDocument: Document
36
    let trailingDocument: Document
37
    @PDFView.Scope private var leadingViewScope
38
    @PDFView.Scope private var trailingViewScope
39

40
    var body: some View {
41
        HStack(spacing: 0) {
42
            // First view uses continuous vertical scrolling.
43
            NavigationView {
44
                PDFView(document: leadingDocument)
45
                    .scrollDirection(.vertical)
46
                    .pageTransition(.scrollContinuous)
47
                    .pageMode(.single)
48
                    .spreadFitting(.adaptive)
49
                    .userInterfaceViewMode(.always)
50
                    .toolbar {
51
                        // Add the default toolbar items.
52
                        DefaultToolbarButtons()
53
                    }
54
                    .pdfViewScope(leadingViewScope)
55
                    .navigationTitle(LocalizedStringKey(leadingDocument.title!))
56
                    .navigationBarTitleDisplayMode(.inline)
57
            }.navigationViewStyle(StackNavigationViewStyle())
58

59
            Divider()
60

61
            // Second view uses horizontal per-page scrolling.
62
            NavigationView {
63
                PDFView(document: trailingDocument)
64
                    .scrollDirection(.horizontal)
65
                    .pageTransition(.scrollPerSpread)
66
                    .pageMode(.single)
67
                    .spreadFitting(.fill)
68
                    .userInterfaceViewMode(.always)
69
                    .toolbar {
70
                        // Add the default toolbar items.
71
                        DefaultToolbarButtons()
72
                    }
73
                    .pdfViewScope(trailingViewScope)
74
                    .navigationTitle(LocalizedStringKey(trailingDocument.title!))
75
                    .navigationBarTitleDisplayMode(.inline)
76
            }.navigationViewStyle(StackNavigationViewStyle())
77
        }
78
    }
79
}
80

81
// MARK: Previews
82

83
struct SwiftUISplitScreenExamplePreviews: PreviewProvider {
84
    static var previews: some View {
85
        let leadingDocument = AssetLoader.document(for: .welcome)
86
        let trailingDocument = AssetLoader.document(for: .annualReport)
87
        SwiftUISplitScreenExampleView(leadingDocument: leadingDocument, trailingDocument: trailingDocument)
88
    }
89
}