Power Apps モダンコンボボックス(CombboxCanvas)の使い方を詳しく解説|モダンコントロール

モダンコントロールのコンボボックス(ComboboxCanvas)の使い方を詳しく調べてみたのでメモ。

モダンコンボボックス(ComboboxCanvas)

モダンコンボボックス(ComboboxCanvas)はキャンバスアプリのモダンコントロールの一つで、ユーザーに選択肢を提供する際に使用するコントロール。
上がモダン、下がクラシックで、だいぶすっきりとした見た目に変わっている。

今回はこのモダンコンボボックスについて詳しく調べてみた。

基本的な使い方

基本的な使い方は前の(クラシックの)コンボボックスとほぼ同じ。

単数選択

まずは単数選択可能なコンボボックスとして使う場合。
Itemsプロパティに選択肢が格納されている配列やテーブルを設定して、ユーザーに選択させる。
単数選択の場合、ユーザーが選択した値はSelectedプロパティでアクセス可能。

複数選択

SelectMultipleプロパティをtrueにすることで、複数選択を有効にできる。
選択肢は単数選択のときと同様に、Itemsプロパティに配列やテーブルを設定する。
単数選択と違うのは、ユーザーが選択した値にSelectedプロパティでアクセスすると、ユーザーが最後に選択したアイテムしか取得できない点。
そこで複数選択を許可したときは、SelectedItemsプロパティを使用して、ユーザーが選択した値にアクセスする。
※SelectedItemsプロパティはテーブル型なので、テキストとして表示するためにConcat関数を使用。
複数選択の主な使い道としては、Dataverseみたいなin演算子を委任可能なデータソースに対して、
選択した項目に一致するデータをFilter関数で抽出する、みたいなときに使用。

既定の選択を設定する

コンボボックスに既定で何かを選択した状態にしたいときは、DefaultSelectedItemsプロパティを使用する。
※Item「s」なので、配列で指定すること。

検索の許可

IsSearchableプロパティをtrueにすることで、選択肢の検索が有効になる。
検索とよく併用するのがOffice365ユーザーコネクタ。
検索を有効にして、画像のようにItemsプロパティにOffice365ユーザーコネクタを設定すると、
検索で絞り込めるようになる。

ちなみに、入力したテキストはSearchTextプロパティでアクセス可能。

クラシックとの違いは主にデザイン

クラシックのコンボボックスとの主な違いは、『出力トリガー(TriggerOutput)』と『デザイン』。

TriggerOutput

モダンテキストボックスと同様に、コンボボックスもTriggerOutputを選択できる。

  • FocusOut:ComboboxCanvasからフォーカスが外れたとき
  • Delayed:ユーザーの入力が止まってから1/2秒後
  • Keypress:ユーザーの入力と同時
DelayedやFocusOutを設定すると、検索ボックスに入力した値がSearchTextプロパティに反映されるまで多少時間がかかる。

ただしこのTriggerOutputは、主に「検索テキスト(SearchText)」に対して影響するプロパティで、選択状態は選択した瞬間に反映される。

Appearance(外観)

Appearanceプロパティは以下の3つを選択可能で、見た目はそれぞれこんな感じ。
ちなみにモダンだとBorderRadiusが設定可能で、角を丸めることができる。

ValidationState

モダンテキストボックスと同様に、ValidationStateプロパティに文字列「Error」を設定すると、線を赤くすることができる。
※Borderの太さが1以上のとき

おまけ1:Itemsを設定しても選択肢が表示されないとき

例えばItemsに配列を設定していて、
Itemsプロパティを変えると、選択肢が表示されなくなる。
これはモダンコンボボックスの[フィールド]が自動で変更されないためで、[編集]から古いフィールドを削除し、
[フィールドの追加]から正しいフィールドを選択すると、選択肢が表示されるようになる。

おまけ2:最大アイテム数

モダンコンボボックスにSequence関数で1200個のアイテムを入れると、
800まで表示されない。データソースとつないでるわけではないので、「委任」とか「データ行の制限」とかに関係なくモダンコンボボックスの最大アイテム数は800と思われる。
※ギャラリーだと1200まで表示される。
ちなみに検索しても801以上は出てこないので、そもそもアイテムが切り捨てられている(かも)。

関連記事

コメント

タイトルとURLをコピーしました