Power Appsのキャンバスアプリを作るうえで欠かせないのがギャラリーコントロール。
データの一覧表示を簡単に実装できるし、選択して操作や、細かなデザイン調整もできてとても重宝するコントロール。
ということで、今回そんなギャラリーコントロールの使い方をまとめてみる。
ギャラリーコントロール概要
ギャラリーコントロールは、同じ形式のデータの集まりを一覧で表示するコントロール。
同じ形式のデータの集まりというのは、
- SharePointリストのアイテム
- Office365ユーザーで取得できるユーザーのデータ群
- カスタムコネクタで引っ張ってきたjsonデータ
- その他自分で作ったコレクションのアイテム群
とかのこと。
これらを少しの実装で一気に一覧で表示してくれるから、とても便利。
今回使用するデータの集まり
今回はO365ユーザーコネクタを使用してユーザーの一覧を取得する。
これを呼ぶとGraphUser_V1データの集まりが、テナントのユーザー数手に入る。
GraphUser_V1の中にはユーザーの名前やらアドレスやら電話番号なんかが入ってる。
ギャラリーコントロールでデータを表示する
実際にギャラリーコントロールにユーザーの情報を一覧で表示してみる。
※デザインの調整が後から入る可能性がある場合は「高さが伸縮可能なギャラリー」を使用することを推奨。
そして、Office365ユーザーコネクタのSearch for users関数とギャラリーをつなげる。
Title1ラベルのTextプロパティに「ThisItem.DisplayName」と入力すると、こんな感じでユーザーの表示名が表示される。
※UserPhotoV2関数はユーザーのIDかUPNを入れると、そのユーザーの写真を返してくれる関数。
と、こんな感じでThisItemを使えば各データの情報にアクセスして、情報を表示できるのがギャラリーのとても便利なところ。
ギャラリーコントロールにボタンを実装する
もちろんデフォルトのLabelコントロールやImageコントロール以外に、こちらでコントロールを追加することもできる。
今回はメールボタンを追加して、メールボタン押下でメーラーを起動し、宛先にそのアイテムの人を指定してみる。
そしたら、そのメールアイコンを押したときにメーラーが起動するようmailtoを埋め込んでいく。
処理を埋め込む方法は2通りあって、
方法1:アイテムに埋め込む方法
すると「mailTo:アドレス」がLaunchされてメーラーが起動する。
方法2:ギャラリーに埋め込む方法
ここの「Parent」はギャラリーのこと。なのでこのように書くと、メールアイコンが押されたときにギャラリーのOnSelectが呼び出される。
こんな感じでギャラリーの各アイテムは「選択された」という状態を持ち、ギャラリー側から選択されたアイテムを取得することも可能。
ということで非常に便利なギャラリーコントロール。他にも色々便利なプロパティがあるけれど、それはまた別の機会に。
コメント