Power Apps iconPower AppsことはじめPower Apps icon
【社内ポータル】お役立ちリンク&備品検索アプリ
Step 2 / 5

[開発] ギャラリーを使って備品を「カタログ風」に表示する

ギャラリーコントロールをカスタマイズして、見やすい一覧画面を作成します。

アプリを作成する

  1. Power Apps左メニューの「アプリ」から「新しいアプリ」>「ページデザインで開始する」を選択します。
  2. サイトのデザインは「Create from blank」を選び、「レスポンシブ」にします。
  3. 開発画面に遷移後、上メニューの「設定」からアプリ名を「お役立ちリンク&備品検索アプリ」にします。
  4. 同じ画面で「説明」にはアプリの説明、アイコンは任意で変更します。
  5. 上メニューの「上書き保存」をします。

Tips: 開発開始時にアプリの名前やアイコンを変更しておくと、開発作業で探しやすくなります。

データの追加

  1. 左メニューの「データ」から「データの追加」>「コネクタ」>「SharePoint」を選択します。
  2. 「SharePointサイトに接続」では、リストを作成したSharePointサイトを選択します。
  3. 「一覧の選択」に表示された作成済みリストを選び、「接続」を実行します。

ギャラリーコントロールの配置

  1. MainContainerを選択し、キャンバスの+マークを押下後、「レイアウト」>「垂直ギャラリー」を選びます。
  2. データソースの選択で、「アプリ内」から追加したデータソースのうち「備品一覧サンプル」を選びます。
  3. レイアウトは「タイトル、サブタイトル、本文」をに変更し、データは「Title」は「備品」、「Subtitle」は「購入日」、「Body」は「場所」にします。
  4. 「Height」をParent.Height、「Width」をParent.Widthにします。

Tips: ギャラリーのデータを選択時、備品~場所は、それぞれfield_#(SharePointリストの項目列の順番)が該当します。

購入日の日付

ここまでのデータ取り扱いは、Excelテーブル、SharePointリスト、Power Appsギャラリーの順番です。
環境によっては、SharePointリストの購入日だけ日付が他のものとずれていることがあるかもしれません。
その要因は、SharePointのタイムゾーン仕様にあります。
タイムゾーンは、標準設定では「太平洋標準時」のため、「日本時間(大阪、札幌、東京」に変更する必要があります。

  1. SharePointの右上にある歯車マークを押下し、「サイト情報」>「すべてのサイト設定を表示」を選択します。
  2. 「サイトの管理」>「地域の設定」を選択します。
  3. 「タイムゾーン」を「(UTC-08:00) 太平洋標準時 (米国およびカナダ)」から「(UTC+09:00) 大阪、札幌、東京」に変更し、「OK」を押下します。
  4. SharePointリストに戻り、画面を更新後、日付が更新されていることを確認します。

時刻の非表示

Excelテーブルでは日付のみを入力していましたが、SharePointリストとPower Appsは仕様上、時刻もデータとして持ちます。
このアプリでは不要なので、それぞれ非表示にします。

  1. SharePointの「購入日」列を選択し、「列の設定」>「編集」から「時間を含める」を「いいえ」にし、「保存」をします。
  2. Power Apps側では左メニューの「データ」から「備品一覧サンプル」のデータソースを選択し、「最新の状態に更新」を実行します。

Tips: データソースのSharePointに従い、Power Appsの表示も自動的に変わります。

できたもの

垂直ギャラリーでSharePointリストを表示