🍎

SwiftでQRコードを生成する

2021/12/26に公開

iOS

仕事でQRコードを生成して表示させる機会があったので、忘れないように記事に起こしてみました。まず、QRコードを生成するには、CIFilterを使う必要があります。

1.　CIFilterを使う

CIFilterとは？

CIFilterとは、公式ドキュメントによれば、

1つまたは複数の入力画像を操作して、または新しい画像データを生成して画像を生成する画像処理装置です。

と説明されています。
CIFilterについて、更に理解を深めたい方は、上記の公式ドキュメントを読んでみてください！

2. 実装

では今回の手順を簡単に説明します。
1.QRコードを設置するためのUIImageViewを定義
2.QRで表示させるURLの文字列を定義
3.QRコードを生成するメソッド(generateQR)の定義
4.URLを設定するメソッド(setURL)の定義
5.完成

コード全文

import UIKit

class ViewController: UIViewController {
    
    //QRコードを設置するためのUIImageViewを定義
    @IBOutlet weak var githubImageView: UIImageView!
    @IBOutlet weak var snsImageView: UIImageView!
    
    let twitterUrlStr = "https://twitter.com/mark_1975M"
    let githubUrlStr = "https://github.com/Markun1975"
    
    override func viewDidLoad() {
        super.viewDidLoad()
        setURL() //各URLを設定した、生成メソッドを呼ぶ
    }
    
    //URLを設定する
    func setURL(){
        generateQR(url: twitterUrlStr, uiImage: snsImageView)
        generateQR(url: githubUrlStr, uiImage: githubImageView)
    }
    
    //QRコードを生成する
    func generateQR(url: String, uiImage: UIImageView){
        let url = url
        // urlをString から Dataへ変換
        let data = url.data(using: .utf8)!
        // ※inputCorrectionLevelは、誤り訂正のレベルを指定するもの
        let qr = CIFilter(name: "CIQRCodeGenerator", parameters: ["inputMessage": data, "inputCorrectionLevel": "M"])!
        let sizeTransform = CGAffineTransform(scaleX: 1, y: 1) // 白枠をつける
        uiImage.image = UIImage(ciImage:qr.outputImage!.transformed(by: sizeTransform))
    }
}

こちらが本実装の全コードとなります。詳しくは下記で詳しく解説ます。

1.QRコードを設置するためのUIImageViewを定義

まず、StoryboardでQRコードを配置する為の、UIImageViewを配置します。
今回は私のGithubとTwitterをQR表示させる為、2つ用意しました。

次に配置したUIImageViewをViewControllerに紐付けます。

@IBOutlet weak var githubImageView: UIImageView!
@IBOutlet weak var snsImageView: UIImageView!

2.QRで表示させるURLの文字列を定義

今回は私のGithubとTwitterをQR表示させる為、まずはそれぞれのURLを文字列で定義します。

let twitterUrlStr = "https://twitter.com/mark_1975M"
let githubUrlStr = "https://github.com/Markun1975"

3.QRコードを生成するメソッド(generateQR)の定義

まず、定数urlに引数で入ってきたurlを代入します。CIFilterに渡すurlはData型である必要があります。その為、urlをStringからDataへ変換します。
次に、CIFilterのインスタンスを生成します。フィルターの初期化時にどんな処理を行うかをnameとしてパラメータに渡します。今回はQRコード生成が目的ですので、nameにCIQRCodeGeneratorを渡します。
CiFilter で行える処理はQRコード生成のCIQRCodeGenerator以外にも様々あります。公式ドキュメント Core Image Filter Referenceに記載されておりますので、読んでみてください！

次に処理に必要なパラメータをCIFilterに渡します。
QRコード生成はinputMessageとinputCorrectionLevelが必要ですので、それぞれパラメータを渡します。inputMessageは今回表示させたいQRのURLになりますので、urlをStringからDataへ変換したdataを渡します。その次にinputCorrectionLevelを渡します。inputCorrectionLevelとは「誤り訂正のレベルを指定するもの」です。

誤り訂正のレベルとは？

誤り訂正のレベルについては、デンソーウェーブさんのQRコード解説ページに詳しく記載されております。今回はその中から基本的な解説だけ引用させていただきます。

QRコードはコードが汚れていたり、破損していても、コード自身でデータを復元する機能を持っています。「誤り訂正能力」は4段階用意されており、ユーザが使用環境に合わせてレベルを選択する事ができます。このレベルを上げれば、誤り訂正能力は向上しますが、データが増えるため、コードのサイズは大きくなります。

引用:株式会社デンソーウェーブ QRコードドットコム
誤り訂正レベルは4段階存在しており、それぞれ L・M・Q・H となっています。
一般的にはMを使うことが多いようです。
本実装でもMを使用します。

func generateQR(url: String, uiImage: UIImageView){
        let url = url
        // urlをString から Dataへ変換
        let data = url.data(using: .utf8)!
        // ※inputCorrectionLevelは、誤り訂正のレベルを指定するもの
        let qr = CIFilter(name: "CIQRCodeGenerator", parameters: ["inputMessage": data, "inputCorrectionLevel": "M"])!
        let sizeTransform = CGAffineTransform(scaleX: 1, y: 1) // 白枠をつける
        uiImage.image = UIImage(ciImage:qr.outputImage!.transformed(by: sizeTransform))
    }

次にsizeTransform で生成画像を成形します。
そして最後に、引数で入ってきたuiImageに生成したqrを入れ、sizeTransformを設定してあげると完成です。

4.URLを設定するメソッド(setURL)の定義

「3.QRコードを生成するメソッド(generateQR)の定義」で定義したメソッドに、表示したいurlと表示させるimageViewを引数に入れます。
viewDidLoadから直接generateQRを呼び出しても良いですが、複数生成したい場合やメンテナンスのし易さを考えてメソッド(setURL)を間に入れております。

func setURL(){
        generateQR(url: twitterUrlStr, uiImage: snsImageView)
        generateQR(url: githubUrlStr, uiImage: githubImageView)
    }

5.完成

これで完成です！では実際に表示されるか見てみましょう！

3. 検証

無事私のGithubとTwitterのQRが表示されました！！

こんな感じで割と簡単にCIFilterを使ってQRコードを生成する事ができます！
CIFilterはQRコード生成以外にも機能が多用ですので、色々試してみると面白いと思います。
読んでいただきありがとうございました！

・サンプルコード

参考サイト

・【iOS】SwiftでQRコードを表示して目で読んでみた
 ・QRコードドットコム
 ・SwiftでQRコードを生成してみた
 ・Swift Dogs - CIFilterの基本