昨日の「【Swift】「QRCodeReader.swift」ライブラリを使ってQRコードリーダ機能を実装する」という記事で、QRコードリーダー機能を実装できるライブラリ「QRCodeReader.swift」について紹介しましたが、これを導入する前に使っていたライブラリもご紹介。
上記の記事でも書きましたが、メルペイで使われている QR コードリーダーのライブラリです。
iOS のバージョンが古いと対象外になるようだったため、新しい OS でしか動かないみたいなのですが、QRコードを読み取る時のアニメーションが iOS 標準のリーダーとかなり似ているのでおすすめです!
画面の白枠が、読み取った QR コードのところにキュッと寄る感じが分かりやすい…!
GitHub はこちらから。
mercari/QRScanner: A simple QR Code scanner framework for iOS. Provides a similar scan effect to ios13+.
https://github.com/mercari/QRScanner
まず、CocoaPods
でライブラリをインストールします。
podfile
に下記を追加してください。
pod 'MercariQRScanner'
なお、この時 Platform が 10.0
であることを確認してください。
もし 10未満だったら下記のように変更します。
platform :ios, '10.0'
上記を追加し終わったら、pod install
コマンドを実行してインストールします。
インストールが問題なく完了したら、コードを実装していきます。
サンプルコードは下記のとおりです。
QR コード読み取りボタンをタップしたら、下記の qrCodeScannerViewController()
のページに遷移するように記述してください。
import UIKit import MercariQRScanner class qrCodeScannerViewController: UIViewController { var qrScannerView = QRScannerView() override func viewDidLoad() { super.viewDidLoad() } override func viewWillAppear(_ animated: Bool) { super.viewWillAppear(animated) // QRコードリーダを起動 qrScannerView = QRScannerView(frame: view.bounds) view.addSubview(qrScannerView) qrScannerView.configure(delegate: self) qrScannerView.startRunning() } override func viewDidDisappear(_ animated: Bool) { super.viewDidDisappear(animated) qrScannerView.stopRunning() } func showAlert(title: String, message: String, action: UIAlertAction) { let alert = UIAlertController(title: title, message: message, preferredStyle: .alert) alert.addAction(action) present(alert, animated: true, completion: nil) } } extension qrCodeScannerViewController: QRScannerViewDelegate { func qrScannerView(_ qrScannerView: QRScannerView, didFailure error: QRScannerError) { // QRコード読み取り失敗時にアラートを表示 let ok = UIAlertAction(title: "OK", style: .default) { (action) in self.dismiss(animated: true, completion: nil) // ページを閉じる self.navigationController?.popViewController(animated: true) } showAlert(title: "エラー", message: error.localizedDescription, action: ok) } func qrScannerView(_ qrScannerView: QRScannerView, didSuccess code: String) { // QRコード読み取り成功時の処理 qrScannerView.showLoading() let ok = UIAlertAction(title: "OK", style: .default) { (action) in qrScannerView.hideLoading() self.dismiss(animated: true, completion: nil) // ページを閉じる self.navigationController?.popViewController(animated: true) } showAlert(title: "成功", message: code, action: ok) // ページを閉じる self.navigationController?.popViewController(animated: true) } }
なお、読み取りに成功したら、アラートで取得した内容を表示しています。
失敗した場合は、エラーメッセージをアラートで表示します。
サンプルコードは以上です。
QR コードリーダーの起動・終了自体は、上記のコードをそのまま転載すれば動作すると思いますので、あとは読み取り成功時・失敗時の処理を変更してください。
以上、Swift の「QRScanner」ライブラリを使って、メルペイの QR コードリーダーをアプリに実装する方法についてでした。
ご参考になれば幸いです。