Power AppsでQRコードを活用する完全ガイド - 読み取り・生成・実用例
Power AppsでQRコードの読み取りから生成まで、バーコードリーダーコントロールの使い方からAPIを活用した生成方法まで実践的に解説します。
この記事でできるようになること
Power AppsアプリでQRコードの読み取り・生成・活用が完全にマスターできます。バーコードリーダーコントロールの基本操作から、外部APIを使った高度なQRコード生成まで、段階的に学習できます。
Power Appsには、QRコードやバーコードを扱うための便利な機能が標準で用意されています。本記事では、QRコードの読み取りから生成まで、実際のアプリ開発に役立つ実装方法を詳しく解説します。
QRコード読み取り：バーコードリーダーコントロール
Power Appsのバーコードリーダーコントロールを使用することで、QRコードを含む様々なバーコードを簡単に読み取ることができます。
バーコードリーダーの基本設定
コントロールの追加
Power Apps Studioで「挿入」タブから「バーコード スキャナー」を選択してコントロールを追加します。
基本プロパティの設定
// OnScan プロパティ
Set(scannedValue, BarcodeReader1.Value);
Notify("QRコードを読み取りました: " & scannedValue, NotificationType.Success)
// Visible プロパティ
isReaderVisible
// Height と Width
Parent.Height * 0.8
Parent.Width * 0.9
読み取ったデータの活用
読み取ったQRコードの値は BarcodeReader1.Value または First(BarcodeReader1.Barcodes).Value で取得できます。
実用的な読み取り機能の実装
シンプルなQR読み取りアプリ
// ボタンのOnSelectプロパティ
Set(showReader, true)
// バーコードリーダーのOnScanプロパティ
Set(qrResult, BarcodeReader1.Value);
Set(showReader, false);
UpdateContext({lastScanTime: Now()})
// 結果表示ラベル
"読み取り結果: " & qrResult
QRコード生成：外部APIとの連携
Power AppsでQRコードを生成するには、外部のQRコード生成APIサービスを活用します。
おすすめのQRコード生成API
GoQR.me API
無料で使いやすい、リアルタイムQRコード生成が可能
QR-Server.com
高性能で様々なオプションに対応、商用利用可能
画像コントロールを使った生成方法
最もシンプルな実装方法は、画像コントロールのImageプロパティに外部APIのURLを設定する方法です。
// 画像コントロールのImageプロパティ
"https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=" &
EncodeUrl(TextInput1.Text)
// より詳細な設定
"https://api.qrserver.com/v1/create-qr-code/?size=" &
qrSize & "x" & qrSize &
"&data=" & EncodeUrl(qrData) &
"&bgcolor=" & Replace(colorBg, "#", "") &
"&color=" & Replace(colorFg, "#", "")Power Automateとの連携
より高度な制御や複数のQRコード一括生成には、Power Automateフローとの連携が効果的です。
フロー作成
ステップ1Power Automateで「PowerApps button」トリガーを使用してフローを作成
HTTP要求
ステップ2HTTPアクションでQRコード生成APIにリクエストを送信
データ保存
ステップ3生成されたQRコード画像をSharePointやDataverseに保存
アプリ連携
ステップ4Power Appsからフローを呼び出して結果を取得
// ボタンのOnSelectプロパティ
Set(flowResult,
'GenerateQRCode'.Run(
TextInput1.Text, // QRコードに埋め込むデータ
Dropdown1.Selected.Value, // サイズ選択
ColorPicker1.Selected // 背景色
)
);
Set(generatedQR, flowResult.qrImageUrl)実用的な活用例とベストプラクティス
在庫管理アプリでの活用
QRコードリーダーで商品コードを読み取り、DataverseやSharePointリストと連携することで効率的な在庫管理が実現できます。読み取り→検索→更新の一連の流れをワンタッチで完結できます。
出荷管理アプリの実装例：
// QRコード読み取り後の処理
Set(productInfo, LookUp(Products, ProductID = BarcodeReader1.Value));
If(
IsBlank(productInfo),
Notify("商品が見つかりません", NotificationType.Error),
Patch(
ShipmentList,
Defaults(ShipmentList),
{
ProductID: productInfo.ProductID,
ProductName: productInfo.Name,
Quantity: Value(TextInput_Quantity.Text),
ScanTime: Now(),
Scanner: User().FullName
}
)
)イベント管理での参加者チェックイン
イベントチェックインアプリ
参加者のQRコード付きチケットを読み取り、自動でチェックイン処理を行う
// QRコード読み取り時の処理
Set(ticketData, BarcodeReader1.Value);
Set(participant, LookUp(EventRegistration, TicketID = ticketData));
If(
IsBlank(participant),
Notify("無効なチケットです", NotificationType.Error),
If(
participant.CheckedIn,
Notify("既にチェックイン済みです", NotificationType.Warning),
Patch(
EventRegistration,
participant,
{CheckedIn: true, CheckInTime: Now()}
);
Notify("チェックイン完了: " & participant.Name, NotificationType.Success)
)
)トラブルシューティング
よくある問題と解決方法
解決手順：
- ブラウザの設定でカメラアクセスを許可
- アプリの設定で「カメラ」の使用を有効化
- HTTPSでアプリにアクセスしているか確認
- モバイルデバイスの場合、Power Appsモバイルアプリを使用
パフォーマンスの最適化
最適化のポイント
QRコード機能を含むアプリのパフォーマンスを向上させるため、以下の点に注意してください。
読み取り性能の向上
生成時の最適化
// キャッシュ機能付きQRコード生成
If(
qrCache.data = TextInput1.Text,
// キャッシュから取得
Set(currentQR, qrCache.imageUrl),
// 新規生成
Set(currentQR,
"https://api.qrserver.com/v1/create-qr-code/?size=200x200&data=" &
EncodeUrl(TextInput1.Text)
);
Set(qrCache, {data: TextInput1.Text, imageUrl: currentQR})
)
まとめ
Power AppsでのQRコード活用は、バーコードリーダーコントロールの活用と外部APIとの連携によって、業務効率化に大きく貢献できます。
重要なポイント
読み取り機能は標準コントロールで簡単実装、生成機能は外部APIとの連携がカギ
QRコード機能は、ユーザビリティとビジネス価値の両方を向上させる強力なツールです。適切な実装により、手作業の削減と正確性の向上を同時に実現できます。
次のステップとして、実際のビジネスシナリオに合わせてQRコード機能をカスタマイズし、より高度な自動化システムの構築に挑戦してみてください。
💭この記事はいかがでしたか？
あなたの感想やご意見をお聞かせください。今後のコンテンツ改善の参考にさせていただきます。
📤この記事をシェア
この記事が役に立ったら、ぜひ他の人にも共有してください！
⚠️ 記事の内容は投稿時点での情報です。最新の情報については公式サイト等でご確認ください。
🔄 内容の正確性には注意を払っていますが、誤りがある場合はお知らせください。