はじめに
工場内、試験施設などでデジタルデータを扱うためにタブレットが使われることがあるが、
事務所以外でデジタルデータを見たり、データをインプットするだけでは
実際の利用者に対してメリットが感じにくいと思われた。
「屋外からでも不具合や確認などのレポートが作成出来る」
ということがユーザーに対し、使ってもらうためのキーの機能になるのでは？と考え、その初期段階としてカメラ画像を取り込み、その内容を保管する機能をPowerApps＋PowerAutomateで試作した。
作成手順
参考に記載の参考資料に従って作業をしたので基本についてはそちらを参照いただきたいが、特に参考資料に記載のない部分や、作業中つまずいたところなどについて記載する。
ただし個々のOffice365(Microsoft365）の環境次第で若干の差異があるかもしれないことはご了承ください。
注意 本資料は2022年09月の情報で作成しています。その後のアップデートなどで方法が変わる場合があるので留意してください。
①Office365にログイン、Power Automateを起動
左肩の9つの点（アプリ起動ツール）をクリックして、アプリにPower Automateがあれば選択。
なければ、すべてのアプリをクリックし、選択する。
②Office365にログイン、Power Automateを起動 その２
作成をクリック、”自動化したクラウドフロー“をクリック
③フローの名称を付与
④トリガーの検索でPowerAppsが探せないので仮に、別のトリガーで作成する。
以下の例ではひとまずすべてのトリガーから探している。
(この場合、⑤以降で消すのでどのトリガーでもよい）
⑤仮に付与したトリガーを削除し、空にした状態でトリガーを検索
⑥新しいステップをクリックし、ステップを追加する。
⑦組み込みタブを選び、データ操作を選択、“作成”をクリック
⑧出来上がった“作成”ステップの名称を変更
⑨入力欄を選択、下図左のポップアップしたメニューから“PowerAppsで確認”をクリック
⑩新しいステップをクリック、OneDrive for Businessを選択
⑪ファイルの作成を選択
⑫以下のように設定し、PowerAutomateを保管する。
・フォルダーのパス：OneDrive内の任意のパス
・ファイル名：png拡張子の任意のファイル名
・ファイルコンテンツ： @{base64ToBinary(replace(replace(outputs('arg_photo_base64'),'data:image/png;base64,',''),'"',''))}
⑬PowerAppsアプリの作成
PowerAppsを起動、空のアプリを作成します。
空のキャンパスアプリを作成、アプリ名を入力して、形式を選択し、作成します。
空のアプリを作成し、最初のスクリーン（Screen1）で「挿入」→「メディア」→「カメラ」を選択し、スクリーン全体にCameraオブジェクト（Camera1）を設定。
図はスマホアプリですがタブレットでも同じことができます。
Camera1のOnSelectプロパティに「Navigate(Screen2,ScreenTransition.None);Set(tmpimg,Camera1.Photo)」と設定。
※アプリを使いたい端末にリアとフロントなどカメラが複数ある場合は、カメラオブジェクトのCameraプロパティを0,1,2…と変更することで撮影時に使用するカメラを切り替えることができます。
「新しい画面」→「空」を選択し、２つ目のスクリーン（Screen2）を作成。
Screen2で「挿入」→「メディア」→「画像」を選択し、スクリーン全体にImageオブジェクト（Image1）を設定。
Image1のImageプロパティに「tmpimg」と設定。
Screen2で「挿入」→ 「入力」→ 「ボタン」を選択し、任意の位置にButtonオブジェクト（Button1）配置。
Textプロパティに「"Retake"」、OnSelectプロパティに
「Navigate(Screen1,ScreenTransition.None)」と設定。
Screen2で「挿入」→ 「入力」→ 「ボタン」を選択し、任意の位置に２つ目のButtonオブジェクト（Button2）配置し、Textプロパティに「"Save"」を設定。
Button2を選択した状態で左ツールボックスの「Power Automate」選択する。
先程作成したフローを選択する。
Button2の詳細設定でOnSelectに “(フロー名).Run(< Image1のImageプロパティの名称 >) ”
この場合 “Photo_test.Run(tmpimg)”
名前を付けてPowerAppsアプリを保存したらPowerAppsは完成です。
利用イメージ
ノートPCでの試行なのでタブレットの場合、操作性が若干違う可能性があります。
①カメラの画像が表示されるのでこれで良ければ画像をタップ（PCの場合マウスクリック）
②別スクリーンが立ち上がり、画像が表示される、OKならSave、再度取り直す場合はRetake/Saveをタップ（PCの場合はクリック）
③指定のOneDriveフォルダーに保管される。
この例では名前指定なので、最新のものだけ保管されている
（前にとったものを残すには修正が必要）
④OneDriveから画像が見れる。
追加項目
タブレットでのチェック結果、そのままでは背面カメラが使えないので以下の機能を追加
ラジオボタンでカメラを切り替える
①ラジオボタンを追加する
下図のように挿入ー入力ーラジオで追加できる。
②ラジオボタンを設定する。
ラジオボタンを選択した状態で“Items”を選択（Microsoftの資料では「項目」とあるが
試した環境上では“Items”) RadioSample>[0,1]へ変更し、0か１を選択できるようにする。
（カメラが2つある場合,0,1でフロント/リアのカメラを切り替える）
③カメラのCaremaの数値をラジオボタンの選択値にする。
下図のようにカメラのアイテムを選択（下図の場合“Camera1”）そこへ
Value([ラジオボタンのアイテム(下図の場合”Radio1”)].Selected.Value)を入力
④ラジオボタンにラベルを追加
ラベルを挿入、Textを書き換える。
将来の拡張について
今回は単純にカメラ画像の保管のみとしたが、以下のように拡張も考えられる。
参考
PowerAppsのカメラで撮影した写真をOneDriveに保存する
https://qiita.com/r-wakatsuki/items/670f85c628ec231a5a5b
【PowerApps】カメラで撮った画像をSharePointリストに保存し、他のアプリで見る。
https://qiita.com/Econoshift/items/2727dc687f5801d87272
PowerAppsカメラコントロールでハマった
https://qiita.com/yamad365/items/c44c2c3bd5bd31f06892
Power Apps でのラジオ コントロール
https://docs.microsoft.com/ja-jp/powerapps/maker/canvas-apps/controls/control-radio
(ただしここで言われている「項目」は”Item”と読み替えること)
PowerAppsからPowerAutomateを実行する(2022/09時点でのボタンでのPowerAutomateの呼出し手順)
https://miseruit.com/2022/06/17/post-2687/