三島正裕の Office 365 徹底活用コラムMicrosoft Power Apps編「Common Data ServiceとQRコードを使って「つぶやく」アプリを作ってみよう」
目次
はじめに
こんにちは！クラウドビジネス担当の三島です。Office365徹底活用コラムPower Apps編ということで、今回はQRコードを使って「つぶやく」アプリを作ってみたいと思います。当社社員からのアイデアだったのですが、「机や壁とかにQRコードがあって、読み取ると何かしら記録が出来たりするアプリがあると業務に役立ちそうだよね。」という発想から、まずは「つぶやく」ことをやってみようということで試しにアプリを作成してみることにしました。
たとえば会議室に入ったら、入ったことを「つぶやいて」みたり、自席に戻ったことを「つぶやいて」みたりして記録しておくと、自分が「いつ・どこで・何を」していたのかを記録することができますよね。自分と仕事で関わる仲間にも状況がわかって便利です。これをQRコードで入力させると、コメントを考える手間も入力をする手間も省けて、いっそう投稿が活発になるはずです。
アプリの仕様を考えてみる
アプリの仕様はこのようにしたいと思います。あらかじめ作成して用意したQRコードを机や壁に貼り付けておきます。張り付けたQRコードをアプリで読み取ると、画面に「つぶやき候補」が表示されるので、ユーザーは選択して投稿します。
データソースを用意する
今回作成するアプリは頻繁に投稿が発生し、データ件数も膨大になる可能性がありますので、運用の面でもExcelやSharePointのリストでつぶやいた内容を記録していくと大変かもしれません。
そこで今回はクラウド型データベースの「Common Data Service」を使って、データの保存場所を作成します。Common Data Serviceでデータを保存するにはエンティティと呼ばれるものを作成します。今回は「つぶやき候補」を保存しておくエンティティ「QRTweet」と投稿内容を保存しておくエンティティ「TweetTB」の２つを作成します。
エンティティを作成するにはPower AppsのTOPメニューからエンティティメニューを表示します。「＋新しいエンティティ」を選択すると新しいエンティティを作成することが出来ます。作成したエンティティには予めデフォルトのフィールドが用意されていますが、つぶやき候補や投稿内容を保存するために新しいフィールドを追加します。「＋フィールドの追加」を選択すると新しいフィールドを追加することが出来ます。フィールドの内容は下図を参考にして下さい。フィールドにはフィールド名やデータ型を指定します。フィールドを作成したらキーも必ず設定します。データを一意に管理するために必要な設定です。
アプリを作成する
Power Appsでアプリを作成します。Power AppsのTOP画面からアプリを選択して「＋新しいアプリ」を選択します。アプリの種類は「キャンパス」を選択します。レイアウトは携帯電話レイアウトを選択して下さい。しばらくすると真っ白なスクリーンが表示されます。
まずは完成イメージをみてみましょう。QRスキャンボタンをタップすると下に読み取ったコードと、そのコードに紐づく「つぶやき候補」が表示されます。ラジオボタンで選択すると「つぶやき候補」が入力フォームに表示されます。入力フォームの内容は編集することが出来ます。「つぶやく」ボタンをタップすると、投稿者名、現在時間と共に「つぶやき」が投稿されます。
それでは作り方の説明に入ります。QRコードを読み取るためのバーコードスキャナーをスクリーンに追加します。Power Appsの編集画面にあるメディアボタンからバーコードスキャナーを選択します。スクリーンにボタンが表示されるので、色や大きさを整えます。ボタンのテキストは「QRスキャン」としておきます。このボタンをスマートフォンで実行すると、カメラが起動しQRコードの読み取りがはじまります。読み取ったQRコードの値は「BarcodeScanner1.Value」にセットされています。これをラベルのプロパティTextにセットをするとスキャナで読み込んだ結果を表示することが出来ます。実際にQRコードを読み込ませると下図のようになります。
続いて「つぶやき候補」を表示するラジオボタンを作成します。ラジオボタンのコントロールは挿入メニューにあります。ドラッグ＆ドロップでラジオボタンの位置を決めて、プロパティItemsの値を下図のようにセットします。
少し複雑になりますが、「つぶやき候補」のテキストはラベルを使って作成します。４つのラベルをラジオボタンの右に縦一列にならべて、それぞれのプロパティTextの値を下図のようにセットします。LookUp関数を使うとエンティティQRTweetのレコードの値を条件指定で取り出すことが出来ます。ここでは、QRコードで読み取った結果と一致するNoのレコードを取得し、その中からラジオボタンの番号と一致する枝番（BranchNo）のレコードの「つぶやき候補(Tweet)」を表示するようにセットしています。
ラジオボタンで選択した「つぶやき候補」を入力フォームにセットします。入力フォームはテキストメニューからセット出来ます。入力フォームのプロパティDefaultには下図のようにセットします。Switch関数でラジオボタンの番号に紐づく「つぶやき」を表示させています。
「つぶやき」の投稿にはボタンを使います。ボタンは入力メニューからセット出来ます。プロパティOnSelectの値を下図のようにセットします。Patch関数を使い、メールアカウントや投稿者、投稿日時、つぶやく内容をエンティティTweetTBに登録します。
ここまでセット出来ましたら、試しにスマホで実行してみましょう。アプリでQRコードを読み込ませると「つぶやき候補」が表示されます。ラジオボタンで選択して入力フォームに投稿内容を表示します。「つぶやく」ボタンを押すとエンティティに「つぶやき」が登録されているはずです。
下図では、つぶやかれた内容を表示するための一覧画面も作成しています。一覧はギャラリーで作成しています。
さて、QRコードでつぶやけるPower Appsアプリは如何でしたでしょうか？今回は「つぶやき」を投稿する機能だけのアプリでしたが、応用をすれば、会議室の入退室管理や作業場所の点検アプリとしても使えそうですよね。今回も短時間で作成出来るアプリですので、ぜひみなさんも試してみて下さい。「Microsoft Power Apps」につきましてはディーアイエスサービス＆ソリューションまでお気軽にお問い合わせください。
それでは次回もお楽しみに。
※PowerAppsについて興味がある方は、こちらをご覧ください。
三島正裕が登壇！オンデマンドウェビナー
Excelでまとめている、その商談記録。わずか10分でスマホアプリにしてみます！
どんなレイアウトでも大丈夫。フリーアドレス座席予約アプリを10分で作成します。
Dataverse をさらっと知りたい皆様へ。画像付きドキュメント管理アプリを10分で作成します。
https://www.cloudtimes.jp/dynamics365/resource/low-code-tool-dataverse-for-teams
