LoginSignup
8
5

More than 1 year has passed since last update.

iOSアプリにQRコードを実装する方法(ひと工夫付き)

Posted at

QRコードはURLやユーザーIDなどを共有するのに便利な手段の一つで、カメラが搭載されているスマートフォンとは特に相性のいいものでもあります。今回はiOSアプリにQRコードを実装する方法とより便利に使うためのひと工夫を紹介します。

満たすべき要件

アプリにQRコードの導入を行うにはどのような機能が必要なのでしょうか。ほとんどの場合は以下の2つの条件を満たしておく必要があります。

  • QRコード生成機能
  • カメラによる読み取り機能

アプリの目的によっては追加する項目も考えられますが、この記事ではまずこれらを可能にすることを念頭において進めていきます。

QRコード生成機能

実装について

これはアプリ内でユーザーが指定したIDなどの文字列をQRコードとして生成する機能です。他の要件に比べると複雑そうに見えますが、実はライブラリなどを導入せずとも実装する事が可能です。シンプルなものでは以下の記事などが参考になりました。

ひと工夫

実用的な面ではこれでも十分ですが、単純な白黒だけのQRコードは少し不親切です。例えばその場では読み込まず一度カメラロールに保存したとき、どんな内容を示すコードだったか分かりにくくなって今います。またSNSで共有するときにも同様の問題が発生します。

LINEの公式アカウントのQRコードのようにロゴが含まれていると何のアプリで使うものか一目で分かりやすくなります。またデザイン性があればシェアしてもらえる可能性も高まるでしょう。

Eveki-4.jpg

iOSであれば以下のライブラリを使うことで個性的な見た目のQRコードを生成することができます。形や色、ロゴの挿入も可能です。

読み取り機能

実装について

iOS、つまりiPhoneにはデフォルトでQRコードリーダーが実装されているため、自分のアプリに読み取り機能を付けるのは必須というわけではありません。しかしひとつのアプリで操作が関係する方が便利ですし、アプリ内で独自の複雑な処理も行うことができます。

こちらも実装のノウハウについて既にかなりの情報があります。基本的なものとしては以下の記事が参考になると思います。カメラの使用許可をユーザーに申請する部分は忘れないようにしてください。

ひと工夫

スキャナーにQRコードのための枠線がついている場合があります。もしアプリが他の目的でカメラを使う場合はこれがあった方が便利でしょう。今は写真を撮るのではなく、あくまでスキャン用のカメラだと明確に区別しやすくなるからです。

またカメラロールからの読み取りも実装しておくのがおすすめです。これがあると「一旦保存して後でスキャンする」という使い方ができますし、SNS上の画像を保存して読み取る事もできます。以下のライブラリではこの2つの要件を満たしているものです。

実装事例

会話AI

最後に私が自分のアプリにQRコードを取り入れた実際の事例を紹介します。

『Eveki』は自分でチャットAIを作れるアプリで、作成した人工知能を共有することも可能です。本アプリではAI固有のIDをQRコードにすることでシェアしやすくしています。

Eveki-5.jpg

コードを読み取ると指定されたAIとのチャットに移行できる仕組みです。デフォルトのQRコードリーダーなどで読み取るとストアページに移行します。

デザインもアプリ名を入れたり色を工夫することで個性を持たせています。スキャナーは検索ボックスの下から使えるように配置し、枠線やカメラロールからの読み取りも対応しました。ちなみにQRコード自体の共有はiOS16から使えるShareLinkを使っています。

まとめ

QRコードの取り扱い自体は案外簡単に実現可能ですが、ライブラリの使用やデザインの工夫を行うことでより便利にする事ができます。少しの手間で大きな利便性を生む事ができるので開発にぜひ活かしてみてください。

8
5
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
8
5