2022.04.13PowerApps│作業効率アップ!各種コントロールのコードをまとめて記述する方法ツイートこんにちは、あんこ先生です。いくつかあるコントロールの幅を揃えたい、テキストの色を変えたいといったとき、ひとつずつ設定していませんか?じつは、コントロールは複数選択することでまとめて設定できちゃうんです。これはコントロールの数が多ければ多いほど、その効果は高まります。特別なスキルは要りません。そこで、今回は知っているとPowerAppsの作業効率が大きく向上する方法を紹介します。初心者から中級者の方は必見です。この記事を読めばすぐに実践できるので、ぜひ最後まで読んでみてください。各種コントロールのコードをまとめて記述する方法コントロールを複数選択した状態でプロパティの値を変更した場合、そのすべてに適用されます。この性質を利用して、複数コントロールをまとめて設定していきます。異なるコントロール選択時は共通プロパティのみ表示される異なる種類のコントロール同士を選択した場合、それらに共通するプロパティのみ表示されるようになります。境界線の色を設定するBorderColorはすべてのコントロールに存在するため表示されます。ラベルとテキスト入力ではTextとDefaultプロパティが共通しないため、どちらも表示されません。選択できるプロパティはコントロールの種類に関係なく、まとめて変更できるわけです。コントロールを複数選択する方法コントロールを複数選択する方法は2種類あります。どちらも一長一短なので、状況に応じて使い分けてください。範囲でまとめて選択する選択したい範囲をマウスでドラッグします。その際、表示されていない(Visible=false)コントロールも含まれます。個別に除きたいコントロールがある場合は、ctrl+クリックで選択を解除します。ctrl+クリックでひとつずつ選択するコントロールをctrl+クリックで選択します。表示されていない(Visible=false)コントロールは選択できません。※ツリービューには表示されるのでそちらからなら選択できます。個別に除きたいコントロールがある場合は、もういちどctrl+クリックで選択を解除します。コントロールの階層を変更する方法ツリービューの三点リーダから再配列を選べばコントロール間の階層を変更できます。これも複数選択すればその並びを維持したまま、相対的に階層を変更できます。ctrl+[またはctrl+]キーで階層をひとつずつ上下に移動することができます。便利なので覚えておいてください。各種コントロールのサイズや位置をまとめて変更する幅を揃える│Widthコントロールを複数選択した状態で、サイズの幅、またはWidthプロパティを変更します。高さを揃える│Heightコントロールを複数選択した状態で、サイズの高さ、またはHeightプロパティを変更します。上寄せ│Yコントロールを複数選択した状態で、サイズのY、またはYプロパティを変更します。左寄せ│Xコントロールを複数選択した状態で、サイズのX、またはXプロパティを変更します。位置揃え時の注意点コントロールを複数選択した状態で、XとYをまとめて設定するとすべて重なってしまいます。不要なコントロールは解除して揃えましょう。階層と同様にツリービューの三点リーダから配置を選べばコントロールのおおまかな整列が行えます。これもコントロールを複数選択すれば、まとめて変更できます。コントロールを3つ以上選択すると表示される左右に整列または上下に整列は、両端のコントロールを基準に等間隔で配置します。その範囲が狭いと重なってしまうため、はじめに両端を配置してから整列させましょう。便利なので覚えておいてください。各種コントロールをまとめて配色するテキスト│Colorテキストについて、Colorプロパティでまとめて配色できます。フォーカス時、ポイント時などのテキストは別プロパティなので注意してください。背景│Fill背景について、Fillプロパティでまとめて配色できます。フォーカス時、ポイント時などの背景は別プロパティなので注意してください。境界線│BorderColor境界線について、BorderColorプロパティでまとめて配色できます。境界線の太さを設定するBorderThicknessプロパティの値が0の場合、表示されません。これはDisabledBorderColor、FocusedBorderColor等もおなじ結果となります。上図だと一番上のラベルが該当します。値を増やせば設定した色の境界線が表示されます。部分ごとの色を設定したいときに役立つ記事はコチラ関連記事PowerApps│図解でわかる!コントロールごとの色設定2022.04.15疑似スタイルシートを設定する変数を用いて動的に配色する色に関するプロパティにRGBA型の変数を指定することで動的に配色することができます。上図ではBorderColorプロパティに_testColorという変数を指定しました。RGB各色に対応したスライダーと連動し、境界線の色が変化します。//スライダーのOnChangeSet(_testColor,RGBA(SliderR.Value,SliderG.Value,SliderB.Value,1))起動時に変数を設定するAppのOnStartプロパティで変数を格納することで起動時に配色できます。疑似的なスタイルシートとして運用できますね。同様にユーザー情報から条件分岐させれば、ユーザーごとに配色を変えることもできます。対象のコントロールについて変数を設定しておく必要がありますよ。サンプルコードは次の通りです。▪OnChange処理などをまとめて記述するユーザー操作に依存するOn~系の処理についてもまとめて設定できます。上図では3つのスライダーがあり、値が変わるたび変数を更新しています。スライダーをひとつずつ選択してOnChangeにそれぞれ処理を記述します。今回は3つなのでさほど手間ではありませんが、対象が増えるほど負担が高まります。これもスライダーを複数選択すれば1回の記述で終わります。複数のコントロールにまったくおなじ処理をさせるなら、Select関数を使った方がメンテナンスが容易になるよ。ギャラリーのテンプレートを使った作業効率UP方法も紹介しています。関連記事PowerApps│Sequence関数とギャラリーを使ったカレンダーをかんたんに作る方法2022.04.26各種コントロールのコードをまとめて記述する方法のまとめ今回は初心者から中級者の方を対象に、各種コントロールのコードをまとめて記述する方法を紹介しました。複数選択すれば共通するプロパティしか表示されなくなるのは便利ですよね。季節ごとに配色を簡単に変更できるので、疑似スタイルシートもオススメです。まとめて設定して作業効率を高めていきましょう!PowerApps│With関数でコードを読みやすく省力化する方法2022.06.14PowerApps│Sequence関数とギャラリーを使ったカレンダーをかんたんに作る方法2022.04.26PowerApps│作業効率アップ!各種コントロールのコードをまとめて記述する方法2022.04.13PowerApps│繰り返し処理ならコレ!ForAll関数の便利な使い方2022.04.12ご支援よろしくおねがいしますこの記事を気に入ってくださった方、寄付してあげてもいいよという方がいらっしゃっいましたら、ご支援いただけると助かります。下記リンクからAmazonギフト券で、金額は15円からお気持ちを入力してください。メッセージもいただけるとたいへん喜びます。コメントをキャンセルメールアドレスが公開されることはありません。※サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。US七草あんこ非IT系中間管理職やってます。社命によりoffice365を主軸とした業務改善プロジェクトメンバーに任命されたことでPowerAppsと出会えました。いまではビジネス・プライベートを問わず、欠かせないツールになっています。導入初期やアプリ作成時に遭遇した諸問題の解決法とサンプルアプリの作り方を紹介していきます。Twitterで情報収集しているので不明点など呟いているとお邪魔するかもしれません。