UnityでQRコードを読み取る方法

UnityでQRコードを読み取る方法をご紹介します。

条件

• Unity 2020.2.7f1
• ZXing
• Android 10

zxing.unity.dllの入手

以下のサイトから、「ZXing.Net.0.16.6.0.zip」をダウンロードして解凍します。
https://github.com/micjahn/ZXing.Net/releases

ZXing.Net.0.16.6.0\unityフォルダにある「zxing.unity.dll」を取り出します。

プロジェクトの作成

テンプレートで3Dを選択し、適当なプロジェクト名を記入して作成します。

プロジェクトのAssetsの下に「Plugins」というフォルダを作り、「zxing.unity.dll」をドラッグアンドドロップで配置します。

ＱＲコード作成

プロジェクトのAssetsの下に「Editor」というフォルダを作り、「CreateQRCode.cs」というC#スクリプトを追加します。

EditorWindowを継承し、[MenuItem(“Tools/Create QRCode”)]とすることで、ヘッダーのメニューにTools > Create QRCodeという選択肢が追加されます。

using UnityEngine;
using UnityEditor;
using ZXing;
using ZXing.QrCode;
using System.IO;

public class CreateQRCode : EditorWindow
{
    [MenuItem("Tools/Create QRCode")]
    static void Init()
    {
        var window = EditorWindow.GetWindow<CreateQRCode>();
        window.Show();
    }

    string _content = "";

    void OnGUI()
    {
        // 保存するQRコードの画像ファイル名
        var path = Application.dataPath + "/QRCode.png";

        // テキストエリアから入力した文字を取得
        _content = GUILayout.TextArea(_content, GUILayout.Height(30f));
        
        EditorGUI.BeginDisabledGroup(string.IsNullOrEmpty(_content));

        if (GUILayout.Button("Save"))
        {
            // QR コードの画像の幅と高さ
            var width = 256;
            var height = 256;

            var writer = new BarcodeWriter
            {
                Format = BarcodeFormat.QR_CODE,
                Options = new QrCodeEncodingOptions
                {
                    Width = width,
                    Height = height
                }
            };

            var format = TextureFormat.ARGB32;
            var texture = new Texture2D(width, height, format, false);
            var colors = writer.Write(_content);

            texture.SetPixels32(colors);
            texture.Apply();

            using (var stream = new FileStream(path, FileMode.OpenOrCreate))
            {
                var bytes = texture.EncodeToPNG();
                stream.Write(bytes, 0, bytes.Length);
            }

            AssetDatabase.Refresh();
            ShowNotification(new GUIContent("QRコードを作成しました。"));
        }

        EditorGUI.EndDisabledGroup(); 
    }
}

テキストエリアに任意の文字列を記入して、Saveボタンを押すとAssetsの下に「QRCode.png」が生成されます。

ＱＲコード読み取り

プロジェクトのAssetsの下に「Scripts」というフォルダを作り、「ReadQRCode.cs」というC#スクリプトを追加します。

using UnityEngine;
using UnityEngine.Android;
using UnityEngine.UI;
using ZXing;

public class ReadQRCode : MonoBehaviour
{
    private const string PERMISSION = Permission.Camera;

    public Text m_text;
    public RawImage m_rawImage;

    private WebCamTexture m_webCamTexture;

    private void Awake()
    {
        // カメラの使用許可リクエスト
        Permission.RequestUserPermission(PERMISSION);
    }

    private void Update()
    {
        // カメラの準備が出来ていない場合
        if (m_webCamTexture == null)
        {
            // カメラの使用が許可された場合
            if (Permission.HasUserAuthorizedPermission(PERMISSION))
            {
                var width = Screen.width;
                var height = Screen.height;

                m_webCamTexture = new WebCamTexture(width, height);

                // カメラの使用を開始
                m_webCamTexture.Play();

                // カメラが写している画像をゲーム画面に表示
                m_rawImage.texture = m_webCamTexture;
            }
        }
        else
        {
            // カメラが写している QRコードからデータを取得し、ゲーム画面に表示
            m_text.text = Read(m_webCamTexture);
        }
    }

    private static string Read(WebCamTexture texture)
    {
        var reader = new BarcodeReader();
        var rawRGB = texture.GetPixels32();
        var width = texture.width;
        var height = texture.height;
        var result = reader.Decode(rawRGB, width, height);

        return result != null ? result.Text : string.Empty;
    }
}

次に、HierarchyのSampleSceneに、Create Emptyで空のGameObjectを追加します。

追加した空のGameObjectに対して、ReadQRCode.csをドラッグアンドドロップしてスクリプトを紐づけます。

HierarchyのSampleSceneに、UI > Canvasを追加します。

さらに、Canvasに「UI > Text」と「UI > RawImage」を追加します。

画面の表示を設定するために、Gameタブで「16:9 Portrait」を選択します。

Canvas > Textを選択して、Inspectorで表示場所やサイズなどを指定します。
今回は、以下のように設定しました。

同様に、Canvas > RawImageを選択して、Inspectorで表示場所やサイズなどを指定します。
今回は、以下のように設定しました。

Canvas > GameObjectを選択して、InspectorでTextとRawImageに、上記で作成＆設定したTextとRawImageを割り当てます。

ビルド＆実行

File > Build Settings で、PlatformにAndroidを選択しSwitch Platformボタンを押します。

Build And Runボタンを押して、ビルドと実行を行います。

初回起動時、写真と動画の撮影の許可ダイアログが表示されるので、「許可」を選択します。

アプリ起動中にQRコードをカメラで読み込むと、上部にQRコードの内容が表示されます。

参考

【Unity】Android で QR コードからデータを読み込む方法

UnityでiOS・Android実機で動くQRコードリーダーを作ってみた