PDF viewer: How to create a PDF viewer app in SwiftUI

In this blog, I have summarised the steps along with the code required to develop a basic PDF viewer iOS app in SwiftUI, using it a user can open and view PDF files. Sometime back, I had been working on a personal project which required PDF files to be loaded and editable ie adding annotations, color editing, etc. It was more of a PDF viewer and annotator app, basically.

Introduction

I started developing the project, initially, in the Swift framework using the PDFKit package. But later, I just decided to try out the same in SwiftUI, instead. As I had been learning about SwiftUI and I found it to be really elegant, sleek, swift (aptly named), and fun to work on. Kind of felt it similar to Flutter’s framework, just a personal perspective.

Steps to create SwiftUI PDF viewer app

For viewing a PDF file or document using PDFKit, only two steps are required for Swift, and in the case of SwiftUI framework, an additional step is needed ðŸ™‚

  1. Fetch a Document object from PDFDocument class by providing the URL/File path of your pdf file
  2. Assign this Document object to a PDFView class object
  3. You need to create a UIView generator wrapper for PDFView class, as SwiftUI doesn’t have a readily available UIView subclass for it.
Fetch a Document object from PDFDocument class

Create a UIView representable wrapper for PDFView class object

Now you can directly use this PDFViewUI object in SwiftUI framework layout

Final outcome : Pdf viewer app

And this is how the app looks on iPad and iPhone simulators.

pdf viewer app in SwiftUI

Source code for pdfviewer app in SwiftUI

If you need the source code for your reference, then you can find it here:
https://github.com/asingh33/Jotty

Are you looking for adding annotations to the PDF viewer app?

BTW if you are looking for more advanced features like adding, removing (undo) annotations, drawing stuff on the PDF then you can checkout my other post – Open source app to add annotations to pdf. This is a Swift iOS app using PDFKit features to add annotations.

Hope you find this post helpful.

Take care!

Share the post, if you liked it

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.