PowerAppsを使って出退勤アプリを作る

PowerAppsを使って出退勤アプリを作る

目次

初めに
構成
Sharepointの設定
PowerAppsの設定
次回

初めに

今回は、PowerPlatformを使った勤怠アプリを作成してみます。
Microsoft製品は機能が多く、使いこなせていないと実感する事が多いです。
PowerPlatformには無料サービスも多く、業務効率に役に立つものも多いので積極的に利用し知識を深めたいところです。

構成

Microsoftのサービスを連携し作成していきます。
データ入力のためにPowerAppsで入力フォームを作成し、入力した内容をSharePointへ蓄積していきます。
最終的にはPowerBIを使ってビジュアライズを行います。

SharePointの設定

まずはSharePointでデータを蓄積するためのリストを作成します。
Microsoft Officeホームにログインし、左サイドメニューから「SharePoint」をクリックします。

次に「サイト作成」をクリックしてチームサイトを作成します。

次に必要情報を入力し「次へ」をクリックします。
 サイト名: サイト名称
 グループメールアドレス: サイトに設定するグループのメールアドレス
 サイトアドレス: サイトにアクセスする際のアドレス
 プライバシーの設定: 誰がアクセスできるかを設定する。「プライベート」はサイトメンバーだけがアクセスでき、「パブリック」は組織に属する全ユーザがアクセス可能。
 言語の選択:既定のサイト言語

メンバーを追加します。
メンバー追加の部分にメールアドレスを入力すると候補が表示されます。

Sharepointサイトが出来ます

Sharepointリストを新規作成します

「+新規」から「リスト」をクリックします。

リスト作成の候補が表示されます。
今回は「空のリスト」をクリックします

リスト名を入力していきます。
リスト名は、リストへアクセスする際のURLの一部になるため、英数字で設定する事が望ましいです。
※日本語での設定も可能ですが、URLが分かりにくいものとなります。

リストが作成出来たら次は蓄積していきたいデータに合わせて列を追加していきます。
列の作成時には数値や日付と時刻、通貨など、データ型があらかじめ用意されているので用途に合ったものを選択します。


今回は出退勤アプリなので最低限下記の列を追加します。
 ・UserName(標準で表示されるタイトルを編集): 入力者
 ・Date and Time(日付と時刻): 入力時間
 ・Attending and Adsence(選択肢): 出・退勤
 ・Office(場所):出社先
また入力時にどの情報が抜けても困るので、必須入力設定を行います。
※必須入力は「その他オプション」より「この列に情報gあ含まれている必要があります」を「はい」にします

必要な列を追加出来たらSharepointでの設定は完了です。


PowerAppsの設定

データを蓄積するための箱をSharepointにて作成しましたので次はデータを入力するフォームをPowerAppsにて作成していきます。
今回は先ほど作ったSharePointのデータから自動で作成する方法を使います。
まずはPowerAppsのページへ遷移します。
SharePointを選択します。

SharePointに接続したら、先ほど作成したサイトが表示されるので、選択します。

リスト一覧が表示されるので、先ほど作成したリストを選択し「接続」をクリックします

少し待つとPowerAppsアプリが出来上がります。
一旦このまま保存して、アプリの入力画面を作ります。

ツリービューの左メニューバーには「BrowseScreen1」「DetailScreeen1」「EditScreen1」の画面が準備されています。

BrowseScreen1は一覧表示の画面です。(作成時一番初めに表示された画面でです)
SharePointにデータが登録されていくと、この画面にデータを表示する事が出来ます。

DetailScreeen1は詳細画面です。
Sharepointで作成した列が表示されます。
TitleはSharepointリストにてUserNameに変更した部分ですが、PowerAPP上だと反映されません。

EdutScreen1は編集画面です。
それぞれの項目を入力するテキストボックスが表示されています。
添付ファイルの項目はSharepointリストに自動的に含まれるものなので、使用しない場合は削除します。
項目を選択したうえで、Deleteキーをクリックする事で削除が可能です。

ここまで出来たら「プレビューボタン」をクリックし、アプリを実行してみます。
BrowseScreen1の画面が表示されるたら右上の「+」をクリックして、入力画面を表示します。

Titleには名前を入力します。
Attending and Adsenceをクリックすると、Sharepointにて設定した選択肢が表示されます。

それぞれの項目を入力が完了したら右上のチェックボタンをクリックします

入力したデータが登録され、画面に表示されます。

項目の「>」ボタンをクリックすると入力内容の詳細が表示されます。

アプリの動作確認が出来たので、一旦画面の右上「×」ボタンでプレビューを閉じます。
登録されたデータがSharepointでも表示される事を確認します。

同じデータが登録されている事が確認できました。
以上でSharepointとPowerAppsの連携は完了とします。

次回

今回はデータ蓄積と入力フォームを作成しました。
入力フォームの内容は、Sharepoint作成時の内容が自動で作成されるため非常にスムーズに作業が進みました。
次回はPowerAutomateやPowerBIとの連携を行い、データのビジュアライズなどを行っていきます。