【iOS開発】Swiftで簡易PDFビューアーを作成（PDFを読み込み、表示）

突然ですが、仕事で急遽必要になったためSwiftで簡易PDFビューアーを作りました。

実際はもう少し色々機能があったのですが、「PDFを表示する」という目的に絞ってスリム化しました。

機能としては以下のようなものです。

①初期画面に「PDF表示」のボタンを配置し、クリックすると「PDF閲覧画面」に遷移。
②PDF閲覧画面にてPDFを表示。ページ切り替えは上下のスワイプにて行う。

ネットでpdfを表示するような記事はヒットするんですが、古いものが多かったので一応Swift3に対応しているものとして、参考となれば幸いです。

プロジェクトの作成

まずは新規で「プロジェクト」を作成します。

Xcodeを立ち上げ、「Create a new Xcode project」をクリックします。

xcode1

次はプロジェクトのタイプを選択します。

「Single View Application」をクリックします。

xcode2

あとはアプリやデベロッパーの名称、言語、対象デバイスを設定します。今回はiPad向けです。

xcode3

PDFの表示

下準備が終わったら、次は実際にPDFを表示するロジックを実装していきます。

以下のような構成です。

xcode4

ViewController.swift

import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}

import UIKit

class ViewController: UIViewController {

override func viewDidLoad() {

super.viewDidLoad()

// Do any additional setup after loading the view, typically from a nib.

}

override func didReceiveMemoryWarning() {

super.didReceiveMemoryWarning()

// Dispose of any resources that can be recreated.

}

ViewController.swiftはプロジェクトを作成すると、自動的に生成されます。

今回はViewController.swiftには一切手を加えていません。

PDFShowViewController.swift

import UIKit
class PDFShowViewController: UIViewController {
var pages = 1
var nowPage = 1
var pdfView = PDFView(frame: CGRect(x: 0, y: 0, width: 0, height: 0))
let pdfName = ConstStruct.pdf_file_name
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
let url = Bundle.main.bundleURL.appendingPathComponent(pdfName)
let doc = CGPDFDocument(url as CFURL)
pages = doc!.numberOfPages
let page = doc!.page(at: nowPage)
let myBoundSize: CGSize = UIScreen.main.bounds.size
pdfView = PDFView(frame: CGRect(x: 0, y: 0, width: myBoundSize.width, height: myBoundSize.height))
pdfView.backgroundColor = UIColor.white
pdfView.page = page
self.view.addSubview(pdfView)
}
//次ページへ
@IBAction func downSwiped() {
if nowPage < pages {
nowPage = nowPage + 1
let url = Bundle.main.bundleURL.appendingPathComponent(pdfName)
let doc = CGPDFDocument(url as CFURL)
let page = doc!.page(at: nowPage)
pdfView.page = page
for subview in self.view.subviews {
subview.setNeedsDisplay()
}
}
}
//前ページへ
@IBAction func upSwiped() {
if nowPage > 1 {
nowPage = nowPage - 1
let url = Bundle.main.bundleURL.appendingPathComponent(pdfName)
let doc = CGPDFDocument(url as CFURL)
let page = doc!.page(at: nowPage)
pdfView.page = page
for subview in self.view.subviews {
subview.setNeedsDisplay()
}
}
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}

import UIKit

class PDFShowViewController: UIViewController {

var pages = 1

var nowPage = 1

var pdfView = PDFView(frame: CGRect(x: 0, y: 0, width: 0, height: 0))

let pdfName = ConstStruct.pdf_file_name

override func viewDidLoad() {

super.viewDidLoad()

// Do any additional setup after loading the view, typically from a nib.

let url = Bundle.main.bundleURL.appendingPathComponent(pdfName)

let doc = CGPDFDocument(url as CFURL)

pages = doc!.numberOfPages

let page = doc!.page(at: nowPage)

let myBoundSize: CGSize = UIScreen.main.bounds.size

pdfView = PDFView(frame: CGRect(x: 0, y: 0, width: myBoundSize.width, height: myBoundSize.height))

pdfView.backgroundColor = UIColor.white

pdfView.page = page

self.view.addSubview(pdfView)

}

//次ページへ

@IBAction func downSwiped() {

if nowPage < pages {

nowPage = nowPage + 1

let url = Bundle.main.bundleURL.appendingPathComponent(pdfName)

let doc = CGPDFDocument(url as CFURL)

let page = doc!.page(at: nowPage)

pdfView.page = page

for subview in self.view.subviews {

subview.setNeedsDisplay()

}

//前ページへ

@IBAction func upSwiped() {

if nowPage > 1 {

nowPage = nowPage - 1

let url = Bundle.main.bundleURL.appendingPathComponent(pdfName)

let doc = CGPDFDocument(url as CFURL)

let page = doc!.page(at: nowPage)

pdfView.page = page

for subview in self.view.subviews {

subview.setNeedsDisplay()

}

override func didReceiveMemoryWarning() {

super.didReceiveMemoryWarning()

// Dispose of any resources that can be recreated.

}

PDFShowViewController.swiftを追加します。このクラスでPDFの表示を行います。

下の部分がメインの処理です。

let url = Bundle.main.bundleURL.appendingPathComponent(pdfName)
let doc = CGPDFDocument(url as CFURL)
pages = doc!.numberOfPages
let page = doc!.page(at: nowPage)
let myBoundSize: CGSize = UIScreen.main.bounds.size
pdfView = PDFView(frame: CGRect(x: 0, y: 0, width: myBoundSize.width, height: myBoundSize.height))
pdfView.backgroundColor = UIColor.white
pdfView.page = page
self.view.addSubview(pdfView)

let url = Bundle.main.bundleURL.appendingPathComponent(pdfName)

let doc = CGPDFDocument(url as CFURL)

pages = doc!.numberOfPages

let page = doc!.page(at: nowPage)

let myBoundSize: CGSize = UIScreen.main.bounds.size

pdfView = PDFView(frame: CGRect(x: 0, y: 0, width: myBoundSize.width, height: myBoundSize.height))

pdfView.backgroundColor = UIColor.white

pdfView.page = page

self.view.addSubview(pdfView)

①PDFファイルの読み込み
②ページ数を読み込んで設定
③PDFViewのインスタンス化
④PDFViewを画面に表示

といった事をやっています。

PDFViewはUIViewを継承したPDFの表示に特化したクラスです。

PDFView.swift

import UIKit
import CoreGraphics
class PDFView: UIView {
var page: CGPDFPage?
override func draw(_ rect: CGRect) {
guard let page = page else { return }
let context = UIGraphicsGetCurrentContext()
context!.translateBy(x: 0, y: rect.size.height)
context!.scaleBy(x: 1.0, y: -1.0)
let box = page.getBoxRect(.artBox)
let xScale = rect.size.width / box.size.width
let yScale = rect.size.height / box.size.height
let scale = min(xScale, yScale)
let tx = (rect.size.width - box.size.width * scale) / 2
let ty = (rect.size.height - box.size.height * scale) / 2
context!.translateBy(x: 0, y: ty)
context!.scaleBy(x: scale, y: scale)
context!.drawPDFPage(page)
}
}

import UIKit

import CoreGraphics

class PDFView: UIView {

var page: CGPDFPage?

override func draw(_ rect: CGRect) {

guard let page = page else { return }

let context = UIGraphicsGetCurrentContext()

context!.translateBy(x: 0, y: rect.size.height)

context!.scaleBy(x: 1.0, y: -1.0)

let box = page.getBoxRect(.artBox)

let xScale = rect.size.width / box.size.width

let yScale = rect.size.height / box.size.height

let scale = min(xScale, yScale)

let tx = (rect.size.width - box.size.width * scale) / 2

let ty = (rect.size.height - box.size.height * scale) / 2

context!.translateBy(x: 0, y: ty)

context!.scaleBy(x: scale, y: scale)

context!.drawPDFPage(page)

}

viewに何か描画したい場合はdrawメソッドを呼び出します。コンテキストを取得して、サイズやスケールなどの設定、最後にdrawPDFPageメソッドにてPDFを表示します。

Define.swift

import UIKit
struct ConstStruct {
static let main_color_red: CGFloat = 0.00
static let main_color_green: CGFloat = 0.40
static let main_color_blue: CGFloat = 1.00
static let main_title_color_red: CGFloat = 1.00
static let main_title_color_green: CGFloat = 1.00
static let main_title_color_blue: CGFloat = 1.00
static let pdf_file_name: String = "setsumei.pdf"
}
class Define{
}