プログラミングの知識が無くてもアプリが作れる PowerApps を試してみた(2)

[前回の記事](http://qiita.com/IKETA/items/a2f33f563e4bb3470791) では、PowerApps へのサインアップとポータル画面の確認を行った。今回は、テンプレートを使用して、実際にアプリを作成してみようと思う。
その前に、アプリ作成の準備を整えるため、まずは PowerApps Studio のインストールから行う。

# PowerApps Studio をインストールする
PowerApps にサインイン後、ポータルのメニュー左下から [新しいアプリ] をクリックする。以下の画面が表示されるので、[Windows 用の PowerApps Studio] をクリックする。
※Web 用の PowerApps Studio もあるが、2016/12/20 現在ではまだプレビュー版であり、使用できる機能も制限されている（テンプレートからアプリの作成も含む）ようなので、今回は Windows アプリを使用する。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/1026b41f-a890-d8d9-94dc-4697d9f59f3d.png)

ストアが開き、PowerApps アプリの情報が表示される。（"PowerApps Studio" とは明記されていないが、以後もこれを PowerApps Studio と呼ぶことにする）
なお、PowerApps Studio をインストールするには、Windows 8.1 以降が必要である。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/030880c4-5b78-e63a-59ba-06e597e1efc9.png)

ストアからアプリをダウンロードするには、Microsoft アカウントを追加する必要がある。[こちら](https://www.microsoft.com/ja-jp/msaccount/) から Microsoft アカウントを取得（すでに持っている場合、この作業は不要）して、![image](https://qiita-image-store.s3.amazonaws.com/0/153436/6a8d4188-0a5f-dfe8-b078-4bc25deb6ebd.png) をクリックしてサインインする。
※ビジネス向け Windows ストアもあるが、筆者の組織アカウントでは以下のように権限がなく、なにもできなかった。アプリをダウンロードできる権限があるのならば、未確認ではあるがこちらから行ってもよいかもしれない。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/729d22ca-9f54-6645-d7ec-306cc200877e.png)

その後、PowerApps Studio の [購入] ボタンをクリックする。ダウンロードが開始され、インストールが行われる。インストール完了後、[起動] をクリックする。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/a7b7d7ad-3cba-66cf-b476-42ec402fa871.png)

PowerApps Studio が起動するので、PowerApps のサインアップで使用した組織アカウントを入力する。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/1b6cef9c-af3b-bd02-4d66-1b4334ba5b09.png)

これで、アプリ作成の準備が整った。


# テンプレートからアプリを作成してみる
それでは早速、アプリを作ってみよう。[新規] メニューをクリックし、アプリテンプレートの [携帯電話レイアウト] をクリックする。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/fc122fe7-3779-339d-a978-39e9952f065f.png)

テンプレートから作成するアプリのデータをどこに保存するかを選択する。画面下の [選択] をクリックする。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/d2af81ba-5ecf-6f09-7e20-10229aa32c78.png)

データを保存する場所を選択する画面が表示される。ここでは、手軽に使用できる [OneDrive] を使用する。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/8be22739-159f-074e-93e8-fd93008991c0.png)

Microsoft アカウントでサインインする。アプリにアクセス許可を与える画面が表示されるので、[はい] をクリックする。
※組織アカウントで OneDrive for Business を使用できるなら、そちらでも可。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/2bfaedd6-30ee-19f0-abaa-ec7eb987cdd1.png)

続いて "Asset Checkout" テンプレートを選択し、[使用] をクリックする。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/01279cce-fe26-ae55-3541-2247c65e7e3d.png)

アプリの作成が始まるので、暫く待つ。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/3bef0a3f-b85c-4dc8-0847-610c7cfb73ea.png)

程なくして Asset Checkout アプリが作成され、以下のような開発画面が表示される。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/3748a97d-8f79-b692-acd8-14ade83d2ac3.png)

画面右上の ![image](https://qiita-image-store.s3.amazonaws.com/0/153436/d4318923-0474-1747-1826-afc0a6ae2015.png) をクリックするか、F5 キーを押すと、アプリのプレビュー（動作確認）ができるので、さっそく動かしてみよう。すると、スマホの画面レイアウトで、Asset Checkout アプリが起動した。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/331a34b8-a061-b128-964c-e45d574dd0b9.png)

ボタンでの画面遷移やリストの表示、星評価（ランキング）などの動作が確認できる。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/53cefbce-780d-eee0-cb7c-dd2a188f54e5.png)

こちらはレビュー画面。なお、アプリに表示されているキーボード（Assets）やレビューなどのデータは、テンプレートからアプリ作成をする時に組み込まれるサンプルデータであり、OneDrive に保存されている。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/a332c770-5ec3-5ccd-a8fd-8801704506c7.png)

ESC キーを押して、プレビューを終了する。アプリはまだ保存されていないので、[ファイル] メニューの [名前を付けて保存] から、適当な名前を指定し、[保存] をクリックする。保存場所はクラウドのままで OK。
![image](https://qiita-image-store.s3.amazonaws.com/0/153436/91bdd605-3ce9-723c-379c-eb728f5c545a.png)


# まとめ
今回は PowerApps Studio のインストールと、テンプレートから Asset Checkout というアプリを作成してみたが、とても簡単に行うことができた。ただし、アプリのデータはサンプルであり、実用するにはアプリの改修なども必要になってくるだろう。
次回はこの Asset Checkout アプリをもとに、アプリがどのように作られているかを確認してみたいと思う。


# 参考文献
Create an app from PowerApps templates
https://powerapps.microsoft.com/ja-jp/blog/using-app-template/