Recommended
Recommended
More Related Content
What's hot
What's hot (20)
Similar to PowerApps 初級ハンズオン(1時間弱でできます)
Similar to PowerApps 初級ハンズオン(1時間弱でできます) (14)
More from Masaru Takahashi
PowerApps 初級ハンズオン(1時間弱でできます)
- 2. もくじ • はじめに • Power Apps で最初のアプリを作成する • 今後の学習について • さいごに はじめに Power Apps では、Office 365 のライセンスまたは無料試用版のいずれかが必要です。 ご自身のライセンス オプションの詳細について確認してください。 Microsoft 製品には、Microsoft Power Apps および Power Automate が含まれます。
- 4. シナリオ 今回は、Microsoft OneDrive for Business に格納されている Microsoft Excel ブックがデータ ソースであるモバイル アプリを生成します。 この Excel ブックには、画像や価格を含む会社の床材のサンプルの在 庫が列挙されています。
- 5. 0. 環境準備 • いつものご自身のIDを利用してPowerAppsをご利用される方 • Microsoft EdgeもしくはGoogle Chromeをご利用ください • いつもとは異なるIDを利用してPowerAppsをご利用される方 • Microsoft Edgeの “In Private”もしくはGoogle Chromeの”シークレット”をご利用ください (ブラウザを開いて“Ctrl＋Shift＋N”) • https://make.powerapps.com を開いてください
- 6. 1. データの準備 1. 以下のアドレスから今回利用するデータをダウンロードする https://az787822.vo.msecnd.net/documentation/get-started-from-data/FlooringEstimates.xlsx 2. Power Appsで利用するユーザーのOneDrive for Businessのフォル ダに、データをアップロードする 以下のリンクから今回のPower Appsで利用するIDでログインして、ファイルをアップ ロードしてください。(ローカルにリンクされている場合は、そちらへコピーして同期を 待ってもかまいません) https://onedrive.live.com/about/ja-jp/signin/
- 7. 2. Excelをもとにしてアプリを生成 (1) 1. https://make.powerapps.com に移動して、自分の組織アカウントでサインインします。(環 境準備にて実施済) 2. 左ウィンドウで、アプリ を選択します。 3. + 新しいアプリ を選択し、ドロップダウン メニューから キャンバス を選択します。 4. OneDrive for Business のデータ ソースで、携帯電話レイアウト を選択します。 生成されたアプリは常に、1 つのリストまたはテーブルを基にしていますが、後でアプリにデータを さらに追加できます。 次スライドでは、Excel ブックへの接続方法について説明しています。
- 8. 2. Excelをもとにしてアプリを生成 (2) 1. OneDrive For Business で、作成 を選択します。 2. 接続 で OneDrive for Business を選択し、ファイルの場所を参照します。 場合によっては、 OneDrive for Business への接続を表示するために 新しい接続 を選択する必要があります。 3. Excel ファイルの選択 で、FlooringEstimates.xlsx ファイルを選択します。 4. テーブルの選択 で FlooringEstimates テーブルを選択します。 5. 右下の 接続 を選択します。 アプリケーションのネタとして、OneDrive For Business内に格納されているExcelファイルの中の床材 サンプルの在庫一覧が入っているシートを選択しています。
- 9. 3. 生成されたアプリケーションを確認する 右上隅にある 再生を選択して、アプリを実際に使ってみます。 テーブルのすべてのデータが含まれていることと、既定で問題なく動作していることをご確認く ださい。 •閲覧画面 - 既定では、この画面が表示されます。 ここでは、データ ソースのデータの参照、並べ替え、フィルター、更新ができます。 閲覧画面では、プラス記号 (+) を選択して、データ ソースに項目を追加できます。 •詳細画面 - 詳細画面には、1 つの項目に関するすべての情報が表示されます。 この画面では、項目を開いて編集または削除することができます。 •編集/作成画面 - この画面では、既存の項目を編集したり、新しい項目を作成したりできます。
- 11. 4. アプリケーションを改善する(閲覧画面) アプリには既に各製品の画像とテキストが表示されていますが、レイアウトには改善が必要です。 1. 左側の [画面] ウィンドウで、BrowseGallery1 を選択します。 ギャラリーを囲む選択ボックスに、選択内容が示されます。 2. 右側のウィンドウで、レイアウト の横のドロップダウン メニューを選択して [データ] ウィ ンドウを開きます。 3. イメージ、タイトル、サブタイトルを表示し、本文は表示しないレイアウトなどの、別のレ イアウトを選択します。
- 12. 4. アプリケーションを改善する(閲覧画面) アプリには既に各製品の画像とテキストが表示されていますが、レイアウトには改善が必要です。 4. ギャラリーの上部にある項目のカテゴリを選択します。 5. 数式バーの ThisItem.Category を ThisItem.Name に変更します。 6. 同様の操作で、製品名の下に価格(ThisItem.Price)が表示されるように変更しましょう。
- 13. 5. アプリケーションを改善する(詳細画面) 詳細画面では、フィールドの順序を変更できます。 この画面のコントロールは閲覧画面のコントロールと は異なるため、これらを変更するプロセスも若干異なります。 1. 左側の [画面] ウィンドウで、DetailScreen1 > DetailForm1 の順に選択します。 2. 右側のウィンドウで、フィールドの編集 を選択します。 3. Imageフィールドをフィールド一覧の下にドラッグし、Nameフィールドを一番下にドラッ グします。
- 14. 6. アプリケーションを改善する([編集/作成]画面) ユーザーがエントリを編集および作成する画面では、テキスト ボックスに情報を入力しやすくする必要が あります。 1. 左側の [画面] ウィンドウで、EditScreen1 > EditForm1 の順に選択します。 2. 右側のウィンドウで、フィールドの編集 を選択します。 3. “Overview”を展開します。 コントロールの種類 のドロップダウン矢印を選択して、複数行 テキストの編集 を選択します。
- 15. 7. 関数を使用してプロパティを変更する プロパティにより、コントロールの外観と動作が決まります。 各コントロールのタイプには、さまざまな プロパティのセットがあります。 このセクションでは、ラベル コントロールのプロパティを使ってギャラリーの価格を設定します。 既定では、価格は通貨記号のない数字として表示されます。 ここでは、ドル記号を追加して、品目の価格 に基づいてテキストの色を変更することにします (たとえば、5 米国ドルより高い場合は赤、それ以外は緑 にします)。 次の図は、想定される結果を示しています。
- 16. 7. 関数を使用してプロパティを変更する 1. BrowseScreen1 で、最初の品目の価格を選択します。 2. プロパティのドロップダウン リストで、Text を選択します。 3. 米国ドルの通貨記号を追加するには、Text プロパティに次の式を設定します。 Text(ThisItem.Price, "$ ##.00") 一覧表記の“価格”を数値から米国ドルの通貨記号が入った形式に変更します。 日本語環境で実行中の場合、上記式に変更とされます (が、今回はテーマ外ですので気にしないでください)
- 17. 7. 関数を使用してプロパティを変更する 4. BrowseScreen1 で、最初の品目の価格を選択します。 5. プロパティのドロップダウン リストで、Color を選択します。 6. 条件に基づいて価格の色を書式設定するには、価格の ラベル を選択して Color プロパティ に次の式を設定します。 If(ThisItem.Price > 5, Color.Red, Color.Green) 一覧表記の“価格”を5ドルより高い場合は赤、それ以外の場合は緑にします。
- 18. 作成されたアプリに含まれる式 Power Apps によって生成されるすべてのアプリで使われる式がいくつかあります。 いずれの例も閲覧画面 のものであり、OnSelect プロパティで動作します。 このプロパティでは、ユーザーがコントロールを選択 したときの動作が定義されます。 “EditForm1を新規入力フォームとして開く；そしてEditScreen1(EditForm1が入っている画面)に遷移する” “SortDescending1という変数の値をひっくり返す(一覧表示アイテムには以下のような設定があり、結果と してソート順が変わります)”
- 19. チャレンジ 1. 詳細画面の”Price”について 1. テキストを右揃えにしましょう 2. 一覧画面同様に、ドル表記のフォーマットに変更しましょう 2. [編集/作成]画面について 1. 詳細画面同様に、Nameを1番上、Imageを1番下にしましょう 2. “Price”を入力するテキストボックスを右揃えにしましょう 3. アプリケーションを保存、発行してスマートフォンで見てみましょう
- 20. 今後の学習について
- 23. 自分にあったコンテンツを探す https://docs.microsoft.com/ja-jp/learn/browse/ 製品 ：Power Apps レベル：初級 種類 ：ラーニングパス を選択して学習を始めましょう
- 24. 最初の学習はこちらがお勧め https://docs.microsoft.com/ja-jp/learn/modules/get-started-with-powerapps/ 本日の学習内容は、こちらの内容を抜粋したものです。 時間の都合上割愛した各種情報にも触れています。 ラーニングパス“Power Apps でキャンバス アプリを作成する” の中にある最初のラーニングコンテンツです
- 25. 自分にあったコンテンツを探す その２ https://docs.microsoft.com/ja-jp/learn/browse/ 製品 ：Power Platform レベル：初級 種類 ：ラーニングパス を選択して学習を始めましょう
- 26. App in a Day https://www.microsoft.com/ja-jp/biz/dynamics/power-platform-aiad.aspx 各種サービスの説明と、ハンズオンがセットになった対話型1dayトレーニング
- 27. App in a Day@Home https://www.youtube.com/playlist?list=PL1RqQ3kddIpa0plPbFZ2ExF-hCnazx-Rd App in a Day のセルフラーニング用動画
- 28. App in a Day のセルフラーニング https://aka.ms/appinadayjp “AppInADay Lab Introduction.pptx”にはシナリオが記載されていますので、こちらから確認ください
- 29. App in a Day のセルフラーニング (注意) “Device-Order-Data.xlsx”というデータを利用しますが、一部修正したのちご利用願います ①”Manufacturers”シートを開く ②”Logo”列(C2:C10)を選択し右クリック ③”ハイパーリンクの削除”を実施 ④ファイルを保存する
- 30. Power Platform Virtual Training Days https://www.microsoft.com/ja-jp/events/top/training-days.aspx?activetab=a1%3aprimaryr4
- 31. さいごに