Go to Qiita Advent Calendar 2024 Top
LoginSignup
3
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

@satoshii

[Swift] iOSで帳票を作成してAirPrintプリンタに出力する

Posted at

概要

iOSで帳票の作成、具体的にはPDFの作成〜確認ダイアログ等なしでの印刷ができるのか調べたところ一応できそうだったので、ほとんど既存記事の切り貼りですが備忘として残しておきます。

プリンタはAirPrint対応機種であれば問題ないと思われますが、手元ではシミュレータでしか確認していないのでご注意ください。

また、あくまで帳票を出力するための要素が揃っていることを調べただけなので、具体的な整形済みの帳票サンプルなども残念ながらありません。

印刷

以下の記事を参考にしつつ、SwiftUIで実装していきます。

基本的には

  • プリンタ選択画面をモーダル表示
  • プリンタを選択 (ここでプリンタのURLを取得できる)
  • 選択したプリンタに印刷

という流れになりますが、あらかじめプリンタのURLが分かっている状況であれば、URLから直接UIPrinterオブジェクトを作成できる (プリンタを特定できる) ため、画面を開いた瞬間に確認なしで印刷を実行するようなこともできます。

ここでは、最初にプリンタ選択画面を表示してプリンタURLを取得し、以降は変更がなければそのプリンタに出力するような流れを考えます。
実際のアプリであれば設定画面に設置するのがよいと思いますが、簡単のため同じ画面内にプリンタ選択ボタンと印刷ボタンを設置しています。

ContentViewはこんな感じです。

/// プリンタを選択してPDFを印刷する
struct ContentView: View {
    @ObservedObject var printerPickerModel = PrinterPickerModel()
    @ObservedObject var printModel = PrintModel()
    /// printingItemの型はNSURL・NSData・UIImageのいずれか
    var printingItem = createPDFData()
    
    var body: some View {
        VStack {
            Text(printerPickerModel.message)
            Text(printerPickerModel.printerUrl?.absoluteString ?? "")
            Button(action: printerPickerModel.showPrinterPicker){
                Text("プリンタを選択する").font(.largeTitle)
            }
            Button(action: {
                printModel.printout(printerUrl: printerPickerModel.printerUrl, printingItem: printingItem)
            }){
                Text("印刷する").font(.largeTitle)
            }.disabled(printerPickerModel.printerUrl == nil)
            Text(printModel.message)
            PDFViewRepresentable(data: printingItem)
        }
        .padding()
    }
}

PDFは実際には色々な値を埋め込むことになるでしょうが、ここではやはり簡単のため固定データとしています。
printingItem には後述する方法で作成したPDFを指定できるほか、画像を指定したり、それらを指すURLを指定することもできます。

プリンタシミュレータの導入

一旦、前記記事でも紹介されているプリンタシミュレータを導入しておきます。

現在は ダウンロードとリソース - Xcode > その他のダウンロード (More Downloads - Apple Developer) からダウンロードできる「Additional Tools for Xcode」の「Hardware」ディレクトリに Printer Simulator.app が入っています。

このシミュレータを起動しておくと、iPhoneシミュレータからプリンタとして認識できるだけでなく、Macと同じネットワークにある実機iPhoneからもプリンタとして認識できたりします。(ポートが開いていれば)

プリンタの選択

前記記事の showPrinterPicker() 関数を参考に、プリンタ選択画面を ObservableObject として実装します。
プリンタを選択すると printerUrl に値が格納されるので、これを参照して印刷を行います。

/// プリンタ選択画面を表示して選択されたプリンタのURLをセットする
class PrinterPickerModel: ObservableObject {
    @Published private(set) var printerUrl: URL?
    @Published private(set) var message = ""
    
    func showPrinterPicker() {
        let printerPicker = UIPrinterPickerController(initiallySelectedPrinter: nil)
        printerPicker.present(animated: true, completionHandler:
            {
                printerPickerController, userDidSelect, error in
                if let error = error {
                    self.message = "プリンタ選択時にエラーが起きました: \(error)"
                } else {
                    // 選択したUIPrinterを取得する
                    if let printer: UIPrinter = printerPickerController.selectedPrinter {
                        self.printerUrl = printer.url
                        self.message = "プリンタが選択されました"
                    }
                    // キャンセル押下時もelseを通るので
                    // メッセージなどは設定しない方が自然そう
                }
            }
        )
    }
}

印刷の実行

またまた前記記事の printToPrinter(printer: UIPrinter) 関数を参考に、印刷処理を ObservableObject として実装します。
折角なので印刷対象を引数で渡せるようにし、簡単なエラー処理も追加しました。

/// プリンタに指定のデータを出力する
class PrintModel: ObservableObject {
    @Published private(set) var message = ""
    /// 指定されたプリンタに指定されたデータを印刷する
    func printout(printerUrl: URL?, printingItem: Any) {
        guard let printerUrl = printerUrl else {
            self.message = "プリンタが選択されていません"
            return
        }
        let printer = UIPrinter(url: printerUrl)
        let printIntaractionController = UIPrintInteractionController.shared
        let info = UIPrintInfo(dictionary: nil)
        info.jobName = "Sample Print"
        info.orientation = .portrait
        printIntaractionController.printInfo = info
        printIntaractionController.printingItem = printingItem
        printIntaractionController.print(to: printer, completionHandler: {
            controller, completed, error in
            guard error == nil else {
                self.message = "印刷時にエラーが起きました: \(error!)"
                return
            }
            if completed {
                self.message = "印刷が完了しました"
            } else {
                // ここは通らなそう (completedがfalseなのはerrorがnot nilの時だけな気がする)
                self.message = "印刷が完了しませんでした"
            }
        })
    }
}

printingItem の型が Any なのは前述の通り画像やURLを渡したりもできるためです。
詳しくは UIPrintInteractionController printingItem を参照してください。

PDFの作成

大きく分けて

  • HTMLをPDFに変換する方法
  • Core Graphics (Quartz 2D) で描画する方法

の2種類があります。

基本的には前者の方が簡単だと思いますが、後者の方が正確な描画ができるのではないかと勝手に想像しているので、両方紹介しておきます。

プレビュー表示

その前に、作成中のPDFをいちいち印刷したりファイルに出力したりして確認するのが面倒なので、プレビュー機能を付けておきます。

struct PDFViewRepresentable: UIViewRepresentable {
    var data: Data
    
    func makeUIView(context: Context) -> PDFView {
        let view = PDFView()
        view.document = PDFDocument(data: data)
        view.autoScales = true
        return view
    }
    
    func updateUIView(_ uiView: PDFView, context: Context) {
    }
}

これで VStack{} 配下に PDFViewRepresentable(data: printingItem) などと置くことでプレビューが表示されます。

HTMLをPDFに変換する

以下のコードをそのまま使わせてもらいます。

PDFをファイルに書き出している // 5. Save PDF file 以下の部分を端折って、代わりに pdfData を返すような関数にしてやれば、そのまま印刷部分に渡すことができます。
プレビュー部分にも同じデータを渡したいので、型は NSMutableData から Data にキャストしておきます。

func createPDFDataFromHTML() -> Data {
    // 1. Create a print formatter
    let html = "<b>Hello <i>World!</i></b>"
    let fmt = UIMarkupTextPrintFormatter(markupText: html)

    (中略)

    UIGraphicsEndPDFContext();

    return pdfData as Data
}

ここではHTMLをベタ書きしていますが、もちろん引数で渡すような作りにすれば汎用的に使えます。

これを

var printingItem = createPDFDataFromHTML()

としてやれば、プレビュー表示とボタン押下での印刷が確認できます。

Core Graphics (Quartz 2D) でPDFを描画する

これも以下のコードをそのまま使わせてもらいます。

上記ページの createPDFData() はランダムな線を描画しているものですが、代わりに頑張って位置を調節した線を引くことで帳票が作成できるでしょう。

一旦この関数をそのままコピペして

var printingItem = createPDFData()

とすることでプレビュー表示とボタン押下での印刷が確認できます。

コード全体

以下に ContentView.swift の全体を貼っておきます。
他所様の記事のコードをここに丸コピペするのも何なので、PDF作成部分は少し改変した createPDFData() のみとして createPDFDataFromHTML() は省略しておきます。

ContentView.swift
import SwiftUI
import PDFKit

/// プリンタを選択してPDFを印刷する
struct ContentView: View {
    @ObservedObject var printerPickerModel = PrinterPickerModel()
    @ObservedObject var printModel = PrintModel()
    /// printingItemの型はNSURL・NSData・UIImageのいずれか
    var printingItem = createPDFData()
    
    var body: some View {
        VStack {
            Text(printerPickerModel.message)
            Text(printerPickerModel.printerUrl?.absoluteString ?? "")
            Button(action: printerPickerModel.showPrinterPicker){
                Text("プリンタを選択する").font(.largeTitle)
            }
            Button(action: {
                printModel.printout(printerUrl: printerPickerModel.printerUrl, printingItem: printingItem)
            }){
                Text("印刷する").font(.largeTitle)
            }.disabled(printerPickerModel.printerUrl == nil)
            Text(printModel.message)
            PDFViewRepresentable(data: printingItem)
        }
        .padding()
    }
}

/// 画面でプレビュー表示するためにPDFView (UIView)をViewに変換
struct PDFViewRepresentable: UIViewRepresentable {
    var data: Data
    
    func makeUIView(context: Context) -> PDFView {
        let view = PDFView()
        view.document = PDFDocument(data: data)
        view.autoScales = true
        return view
    }
    
    func updateUIView(_ uiView: PDFView, context: Context) {
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

/// プリンタ選択画面を表示して選択されたプリンタのURLをセットする
class PrinterPickerModel: ObservableObject {
    @Published private(set) var printerUrl: URL?
    @Published private(set) var message = ""
    
    func showPrinterPicker() {
        let printerPicker = UIPrinterPickerController(initiallySelectedPrinter: nil)
        printerPicker.present(animated: true, completionHandler:
            {
                printerPickerController, userDidSelect, error in
                if let error = error {
                    self.message = "プリンタ選択時にエラーが起きました: \(error)"
                } else {
                    // 選択したUIPrinterを取得する
                    if let printer: UIPrinter = printerPickerController.selectedPrinter {
                        self.printerUrl = printer.url
                        self.message = "プリンタが選択されました"
                    }
                    // キャンセル押下時はelseを通るがメッセージなどは設定しない方が自然
                }
            }
        )
    }
}

/// プリンタに指定のデータを出力する
class PrintModel: ObservableObject {
    @Published private(set) var message = ""
    /// 指定されたプリンタに指定されたデータを印刷する
    func printout(printerUrl: URL?, printingItem: Any) {
        guard let printerUrl = printerUrl else {
            self.message = "プリンタが選択されていません"
            return
        }
        let printer = UIPrinter(url: printerUrl)
        let printIntaractionController = UIPrintInteractionController.shared
        let info = UIPrintInfo(dictionary: nil)
        info.jobName = "Sample Print"
        info.orientation = .portrait
        printIntaractionController.printInfo = info
        printIntaractionController.printingItem = printingItem
        printIntaractionController.print(to: printer, completionHandler: {
            controller, completed, error in
            guard error == nil else {
                self.message = "印刷時にエラーが起きました: \(error!)"
                return
            }
            if completed {
                self.message = "印刷が完了しました"
            } else {
                // ここは通らなそう (completedがfalseなのはerrorがnot nilの時だけな気がする)
                self.message = "印刷が完了しませんでした"
            }
        })
    }
}

/// PDFデータを作成してData型で返す
/// この戻り値は PDFDocument() のコンストラクタ引数に指定したり
/// UIPrintInteractionControllerのprintingItemプロパティに指定したりできる
func createPDFData() -> Data {
    let pdfMetaData = [
        kCGPDFContextCreator: "@example",
        kCGPDFContextAuthor: "example.com"
    ]
    let format = UIGraphicsPDFRendererFormat()
    format.documentInfo = pdfMetaData as [String: Any]
    
    // A4サイズ
    let pdfWidth: CGFloat = 2100
    let pdfHeight: CGFloat = 2900
    let pageRect = CGRect(x: 0, y: 0, width: pdfWidth, height: pdfHeight)
    let renderer = UIGraphicsPDFRenderer(bounds: pageRect, format: format)
    
    return renderer.pdfData(actions: renderReport)
}

/// UIGraphicsPDFRendererContextを使って帳票を描画する
func renderReport(context: UIGraphicsPDFRendererContext) {
    // これはUIGraphicsPDFRendererContextにしかない
    context.beginPage()
    
    let text = "Hello World!"
    let attributes = [
        NSAttributedString.Key.font: UIFont.boldSystemFont(ofSize: 72)
    ]
    text.draw(at: CGPoint(x: 0, y: 0), withAttributes: attributes)
    
    let linePath = UIBezierPath()
    linePath.move(to: CGPoint(x: 0, y: 100))
    linePath.addLine(to: CGPoint(x: 1000, y: 100))

    let layer = CAShapeLayer()
    layer.path = linePath.cgPath
    layer.fillColor = UIColor.black.cgColor
    layer.strokeColor = UIColor.black.cgColor
    layer.lineWidth = 4
    layer.render(in: context.cgContext)
}
3
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
3
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?