PowerApps でPCでも使えるバーコード スキャナーを追加する

PowerApps のアプリにバーコード読み取り機能を追加する の番外編です。
スマートフォンで使えるバーコード スキャナーは読み取りが早く使い勝手も良いのですが、パソコンでは使えません。
パソコンのカメラを使いたい時は、Webバーコード スキャナーが利用できます。

Web バーコード スキャナー

元々あったバーコード コントロールが Web バーコード スキャナーと名前変わったそうです。
(参考: PowerApps でバーコードをスキャンする)

Web バーコード スキャナーの有効化

Web バーコード スキャナーは、実験的な機能として無効化されています。今後、使えなくなる可能性もありますので自己責任で使用する事になります。
以下の手順で、[挿入]-[メディア]メニューに[Web バーコード スキャナー]が追加されます。

コントロールの有効化手順

1. アプリの編集画面を開く
2. [ファイル]-[アプリの設定]メニューを順にクリック
3. アプリの設定画面で[詳細設定]タブをクリック
4. 実験的な機能 セクションの [Web バーコード スキャナー]をオンにする

バーコード読み取り画面を作る

バーコードを読み取ってその後の処理を実行する画面を作成します。ここでは座席情報を登録します。

1. 新しい画面を作成

1. アプリの編集画面を開く
2. [挿入]メニューをクリック
3. [新しい画面]-[フォーム]の順にクリック
4. 画面ツリーでScreen1(数値は変わります)の名前を変更 (ここでは BarcodeScreen)
5. 画面ツリーでEditForm4(数値は変わります)を削除
6. 画面ツリーでLblAppName9（数値は変わります)のクリックしてプロパティのテキストを変更(ここでは座席バーコード スキャン)

2. Web バーコード スキャナーを追加

1. [メディア]-[Web バーコード スキャナー]をクリック
2. 追加されたコントロールの位置を調整
3. プロパティのバーコードのタイプを使用するバーコードに合わせる

3. テキスト ボックスを追加

1. [テキスト]-[テキスト入力]の順にクリック
2. 追加されたコントロールの位置を調整
3. 数式バーで[Default]にバーコードの値を参照する様に設定

Default

Barcode1.Text

4. バーコード 読み取り後の処理を設定

1. 画面ツリーでIconAccept4(数値は変わります)をクリック
2. 数式バーで[OnSelect]に処理を設定

OnSelect

If (IsMatch(TextInput1.Text, "DESK[1-2]-[A-B][1-4]"), 'PowerApp->複数の項目の取得'.Run(User().Email, TextInput1.Text);Navigate(BrowseScreenFloor, ScreenTransition.None);Refresh(Floor), Notify("NG: " & TextInput1.Text, NotificationType.Error))

5. キャンセル ボタンを設定

1. 画面ツリーでIconCancel4(数値は変わります)をクリック
2. 数式バーで[OnSelect]に初期画面への遷移を追加

OnSelect

Navigate(BrowseScreenFloor, ScreenTransition.None)

6. 初期画面にバーコード 読み取り画面ボタンを追加

1. 画面ツリーで初期画面のBrowseScreenFloorをクリック
2. [アイコン]をクリックして適切なアイコンを選んでクリック
3. 追加されたアイコンの位置を調整
4. 数式バーで[OnSelect]にバーコード読み取り画面への遷移を追加

OnSelect

Navigate(BarcodeScreen1, ScreenTransition.None)

今回わかったこと

• PowerApps
  • Web バーコード スキャナーを使う時は設定で有効化する必要がある。
  • スマートフォン用のバーコード スキャナーの使いやすさを実感した。

2in1 ノート パソコンを使っている人もいると思いますが、パソコンでバーコードを活用したい人は少ないのだろうか？