PowerAppsで備品管理アプリ開発をしました！

PowerAppsでの簡単な備品管理アプリ開発を行ったので、初めてPowerApps利用される方にも参考にしていただけるよう、また筆者における備忘の意味合いも含めて、作成手順を記します。

【アプリの概要】
・「誰が」「何の備品を」「いつ」持ち出ししたかを管理できるアプリ
・OneDrive上で、社員一覧・備品一覧・持ち出し履歴を管理できる仕組みとしている

【アプリ作成手順】
① エクセルを準備する
・管理したい項目が社員一覧・備品一覧・持ち出し履歴の3つなので、それぞれのテーブルを準備する※PowerAppsとの接続の際に、テーブル化が必須のため
・作成したエクセルをOneDriveに格納

（例）社員テーブルのテーブル化

② PowerAppsで新規作成
・PowerAppsで作成＞空のアプリ＞空のキャンバスアプリを押下
・アプリ名を入力し、今回はiPadでの利用だったので、タブレットを選択して「作成」

③ 作成したエクセルと連携する
・データ＞データの追加＞OneDrive for Business選択
・格納したエクセルを選択した上で、作成したテーブルを選択し「接続」を押下
※今回は、エクセル上で3つのテーブル（持ち出し履歴、社員名、備品一覧）を作成したため、3つを選択

④ 初期画面を作成（Screen1）
・挿入より、四角形を選択
・挿入より、テキストラベルを選択
・テキストラベルには「備品管理アプリ」と記載。右側の「プロパティ」より、フォントサイズや色を選択する
・四角形とテキストラベルを上部に持っていき、見出しのようにする

・挿入より、ボタンを選択
・ボタンの文言を「はじめる」に変更し、フォントサイズや文字色を変更
・ボタン選択した状態で、左上を「On Select」にし下記を入力
※手動でエクセルファイルを更新した時に、PowerAppsにも反映されるようRefresh関数を使用しています。
・ツリービュー＞新しい画面＞空を選択し、「Screen2」を作成

Refresh(社員名); //「社員名」テーブルを更新
Refresh(備品一覧); //「備品一覧」テーブルを更新
Navigate(Screen2,ScreenTransition.None) // On Select（ボタン押下）時にScreen2に移動。「ScreenTransition」では、画面切り替え時のユーザへの見せ方を変更可能

Refreshは、OneDriveのエクセルを手動で更新した時に、意識せずにPowerAppsに反映されるように、設定しています。

⑤ 社員番号選択画面を作成（Screen2）
・挿入＞垂直ギャラリーを選択し、データソースを「社員名」とする
・プロパティにて、レイアウトを「タイトルとサブタイトル」にし、文字の大きさを変更
・社員番号と社員名のフォントサイズを変更
※垂直ギャラリーでは、一番上の枠箇所だけ（今回でいうと、テスト1記載箇所）修正すれば、以降については、その設定を反映してくれます。

・挿入より、四角形を選択
・挿入より、テキストラベルを選択
・テキストラベルには「社員選択」と記載。右側の「プロパティ」より、フォントサイズや色を選択する
・垂直ギャラリーで左上箇所を、OnSelectにして、下記を入力
※最終的に、誰が何をいくつ選択したかを記憶する必要があるので、変数を使用しています。

Set(gblCD,ThisItem.社員番号); //「gblCD」という変数に社員名を格納
Set(gblName,ThisItem.社員名); //「gblName」という変数に社員名を格納Navigate(Screen3,ScreenTransition.None) // On Select（ボタン押下）時にScreen3に移動

⑥ 備品選択画面を作成（Screen3）
・ほぼ⑤と同じなので、割愛します。
・垂直ギャラリーのレイアウトを「タイトル」にする。
・OnSelect内は、下記を入力

Set(gblItem,ThisItem.備品一覧);
Navigate(Screen4,ScreenTransition.None)

⑦ 数量入力画面の作成（Screen4）
・挿入より、四角形・テキストラベルを選択。テキストラベルは「数量選択」
・挿入より、垂直ギャラリーを選択
・垂直ギャラリーのItemsに下記を設定

["1","2","3","4","5","6","7","8","9","0","","AC"]

・右側のプロパティより、折り返しの数を「3」に設定
・垂直ギャラリーの「OnSelect」を下記に設定

If(
ThisItem.Value = "AC",
UpdateContext({typeNum: Blank()}), //ACボタン押下時は「typeNum」変数を空白にする
UpdateContext({typeNum: typeNum & ThisItem.Value}); //数字押下時は「typeNum」変数に数値を格納する
)

・垂直ギャラリーの中に、挿入より、ボタンを作成（1つのみ）
※垂直ギャラリーの幅を大きくすれば、Itemに設定した数だけ、ボタンが表示されます。
・作成したボタンの「Text」を「ThisItem.Value」に設定
・作成したボタンの「Visible」を「If(ThisItem.Value="",false,true)」に設定

・挿入より、テキストラベルを選択。テキストを「typeNum & "個"」にし、フォントサイズやテキストのアライメントを右配置に変更
・挿入より、ボタンを選択。テキストをOKに設定
・ボタンの「OnSelect」を下記に設定

Set(gblNum,typeNum); //typeNum(ローカル変数)の値をgblNum（グローバル変数）に格納
UpdateContext({typeNum:Blank()}); //typeNumの値をブランクに設定Navigate(Screen5,ScreenTransition.None) //Screen5に移動

⑧ 最終確認画面の作成（Screen5）
・挿入より、四角形とテキストラベルを選択し、テキストラベルに「確認」を入力
・挿入より、テキストラベルを選択し、Textに下記を入力

"担当者名：" & gblName & Char(10) &
"備品名：" & gblItem & Char(10) &
"数量：" & gblNum & " 個"

・挿入より、ボタンを2つ選択し、1つは「TOPへ戻る」もう一つは「OK」とする
・「TOPへ戻る」ボタンの「OnSelect」は、下記を設定

Set(gblCD,Blank()); //gblCD（社員コード）をブランクにする
Set(gblName,Blank()); //gblName（社員名）をブランクにする
Set(gblItem,Blank()); //gblItem（備品名）をブランクにする
Set(gblNum,Blank()); ////gblNum（数量）をブランクにする
Navigate(Screen1,ScreenTransition.None)

・「OK」ボタンの「OnSelect」には、下記を設定

Patch(持ち出し履歴,Defaults(持ち出し履歴), //持ち出し履歴テーブルに、各値を入力
{担当者名:gblName, //担当者名列に、gblNameを設定
備品名:gblItem, //備品名列に、gblItemを設定
数量:gblNum, //数量列に、gblNumを設定
日時:Text(Now(),"yyyy/mm/dd hh:mm","ja-JP")});
Set(gblCD,Blank()); //gblCD（社員コード）をブランクにする
Set(gblName,Blank()); //gblName（社員名）をブランクにする
Set(gblItem,Blank()); //gblItem（備品名）をブランクにする
Set(gblNum,Blank()); ////gblNum（数量）をブランクにする
Navigate(Screen1,ScreenTransition.None)

【アプリの実行結果】
上記で作成したアプリを実行していくと、下記のような結果が得られます。
※右上のプレビューボタンから、任意のタイミングで操作確認できます。

＜最終画面＞