チェックボックスって複数をひとまとめにして使うことが多いと思うんだけど、Power Appsではチェックボックスをグループ化みたいなことはできない。
Power Appsでチェックボックスを一気に操作したいなってなったときに、地味にひっかかったのでここにメモ。
チェックボックスについて
すごく今更感あるけどチェックボックスについて少しだけ。
チェックボックスは「チェック」と「非チェック」の2つの状態を持つコントロールで、複数選択できる選択肢とかでよく使われるコントロール。
※単一選択の時はラジオボタンがよく使われるイメージ
Power Appsのチェックボックスはチェックの状態をValueプロパティで確認できて、
- チェック状態 → true
- 非チェック状態 → false
みたいな感じでbool値で表現されている。
公式はこちら
Power Apps での チェックボックス コントロール - Power Apps
Power Apps でのチェックボックスのコントロールについての詳細、プロパティ、例について説明します。
実装
それでは早速複数のチェックボックスを一気に操作してみる。
事前準備
まずはチェックボックスがあるスクリーンのOnVisibleとかで、こんな感じでコレクションを作る。
そしたらギャラリーを追加して(もちろん縦でも横でもOK)
さっきのコレクションと接続。
チェックボックスをギャラリーの中に追加して、一度アプリを再起動するか適当なスクリーンに移動して戻ってくると、チェックボックスが複数表示されるはず。
チェックボックスの座標とかギャラリーのアイテムの高さとかをいい感じにいじった後、チェックボックスのDefaultプロパティにValue値を、TextプロパティにText値を結びつける。
そしたら、チェックボックスのチェック状態とValue値が連動するようにPatch関数をこんな感じで追加する。
※予期しない挙動を防ぐためOnSelectはfalseに設定
※予期しない挙動を防ぐためOnSelectはfalseに設定
これで事前準備完了なので、軽く動作確認をする。動作確認用にValue値を表示するラベルを追加して
チェック状態とValueが連動するかを確認。いい感じ!!
一気にチェックする
まずは一気にチェックする機能から実装。
「全チェック」ボタンを追加して、OnSelectにこんな感じで全アイテムのValue値をtrueにするような式を書く。
ボタンを押してみるとこんな感じで全部チェックされる!
一気にチェックを外す
続いて一気にチェックを外す機能。
「全チェック外し」ボタンを追加して、さっきと同様OnSelectにこんな感じで全アイテムのValue値をfalseにするような式を書く。
ボタンを押してみるとこんな感じで全部チェックが外れる!
集計も簡単
チェックが付いているチェックボックスの個数を数えたいときなんかは、こんな感じで式を書いてあげれば、
勝手に数が動いてくれるので便利。
さらにこんな感じで式を書いてあげれば
全部にチェックが付いているか?のチェックも簡単にできる。
選択肢の追加も簡単
今回はチェック状態を保持するしくみをコレクションで作ったので、選択肢を増やすことも簡単。
こんな感じでアイテムを追加してあげれば、
選択肢が簡単に増えるのでメンテも楽だし、
ボタンとかにこんな式を書いてあげれば
選択肢の動的追加(ユーザーによる追加)も簡単!
ギャラリーを使っているので細かなデザイン調整はできないという欠点はあるけれど、逆にX座標とかチェックボックス間のMarginとかはギャラリーがいい感じに表示してくれるので、たくさんのチェックボックスを手動で追加/更新するのがめんどうなときはこの方法が便利かなと思う。
コメント