Power Apps のギャラリーは、そのままでは細かいレイアウト調整が難しいコントロールです。内側にコンテナを組み合わせることで、余白・整列・パディングを自由にコントロールできるようになります。
なぜギャラリー内にコンテナが必要なのか
ギャラリーコントロールには TemplatePadding というプロパティがあります。これは各行（テンプレート）の外縁に均等に余白を設定するプロパティです。問題は、すべての辺に同じ値が適用されること。上下に10px、左だけ16px、右は0pxといった非対称なパディングは、TemplatePadding だけでは実現できません。
さらに、テンプレート内のコントロールを右寄せにしたい、あるいは特定の要素を下端に揃えたいといったレイアウト要件も、コントロールを直接ギャラリーに置くだけでは対応しにくいです。ギャラリーの基本的な使い方についてはギャラリーコントロールの基本と検索・選択の組み合わせ方で解説していますが、ここではその先の細かいレイアウト調整を掘り下げます。
こうした問題を解決するのが、ギャラリーのテンプレート内にコンテナを設置するアプローチです。TemplatePadding を 0 にしてギャラリー側の余白管理を放棄し、コンテナ側でパディング・整列・サイズをすべて制御します。
ルートコンテナの基本設定
まず、ギャラリーのテンプレート直下に配置するルートコンテナの設定です。このコンテナはテンプレート全体を覆うように配置するため、以下の4つのプロパティをこの値に設定します。
X: 0
Y: 0
Width: Parent.TemplateWidth
Height: Parent.TemplateHeightParent.TemplateWidth と Parent.TemplateHeight を参照することで、ギャラリーのテンプレートサイズが変わっても自動的に追従します。絶対値（ピクセル数）で書くと、ギャラリーの幅を後から変更したときにコンテナだけ合わなくなるという事故が起きます。必ず Parent 参照で書きましょう。
TemplatePadding を 0 に設定する
ルートコンテナを配置したら、ギャラリー本体の TemplatePadding プロパティを 0 に設定します。これでギャラリー側の余白管理を完全にオフにします。以降のパディング・整列はすべてコンテナ側で行います。
この設定を忘れると、コンテナに Padding を設定してもギャラリー側の TemplatePadding が加算されてしまい、意図した余白より広くなる、という現象が起きます。余白を設定したのになぜか大きいと感じたときは、まず TemplatePadding を確認してみてください。
カスタムパディングの2つのパターン
パターン①：コンテナのサイズをテンプレートより小さくする
最もシンプルな方法は、コンテナのサイズをテンプレートより少し小さくして、その差分を余白として使うやり方です。例えば幅を TemplateWidth の 90% にして、残りの 10% を左右の余白として活用します。
Width: Parent.TemplateWidth * 0.9
X: Parent.TemplateWidth * 0.05垂直方向のセンタリングは少し計算が必要です。コンテナの Height を Parent.TemplateHeight より小さくした上で、Y プロパティに次の式を入れます。
Y: (Parent.TemplateHeight - Self.Height) / 2テンプレートの高さからコンテナの高さを引いた差を2で割ることで、上下均等に余白が入ります。難しく見えますが、余った空間を半分ずつ上下に振り分けるという発想です。
パターン②：外側コンテナ＋内側コンテナの2層構造
より柔軟な方法は、透明な外側コンテナと見た目を担当する内側コンテナの2層構造にすることです。外側コンテナはパディングだけを担当し（PaddingLeft・PaddingRight・PaddingTop・PaddingBottomをそれぞれ独立して設定）、内側コンテナがカードの見た目（背景色・ボーダー・シャドウなど）を担当します。
この方法の利点は、非対称なパディングが自然に書けることです。左だけ16px、上下は8px、右は0pxといった指定も、外側コンテナのPaddingプロパティを4辺個別に設定すれば実現できます。
内側コンテナには Fill でカード背景色を設定し、外側コンテナは Fill=Color.Transparent にします。これで余白と見た目の責任が分離されるため、後からどちらかだけを変更しやすくなります。
実例：TemplateSize 計算式の読み方
実際のアプリで使っている colResentVessel というコレクションのギャラリーで、TemplateSize プロパティにこんな式が入っています。
(Self.Height - Self.TemplatePadding * 10) / 9一見複雑ですが、読み解くと単純です。このギャラリーは9行表示を想定しています。ギャラリー全体の高さ（Self.Height）から、行間のパディング合計（TemplatePadding × 10）を引いた残りを9等分する、という計算です。TemplatePadding が10倍になっているのは、9行の間に行間が10箇所あるからです（上端・各行間・下端）。
こういった高さから逆算して行数で割るパターンは、ギャラリーをスクロールさせずにぴったり収めたいときによく使います。体感的に、表示件数が固定されている管理リスト系のアプリでは特に重宝します。
セパレーター（区切り線）を追加する
ギャラリー行間に区切り線を入れたい場合、Rectangle（四角形）コントロールをテンプレート内に配置して使います。Height を 1 に設定し、Y を 0（テンプレートの一番上）に置くと、各行の上部に区切り線が入ります。
Height: 1
Y: 0
Width: Parent.TemplateWidth
Fill: RGBA(220, 220, 220, 1)BorderStyle を Dashed にすると点線のセパレーターになります。デザインによって実線・点線を使い分けてみてください。コンテナのネスト構造と命名規則を整理しながら作業を進めると、ツリービューが複雑になりにくいです。コンテナのネスト構造の考え方についてはコンテナのネスト構造を作る方法の記事を先に読んでおくと理解が深まります。
まとめ
ギャラリー内のレイアウトを細かく制御したいなら、コンテナを使うのが最善の方法です。TemplatePadding を 0 にしてコンテナに管理を移すことで、非対称な余白・整列・複数要素の配置がすべて柔軟に扱えるようになります。
最初の一歩はルートコンテナをテンプレートと同じサイズで配置するだけです。あとはコンテナのパディングやネスト構造で、やりたいレイアウトに近づけていきましょう。市民開発はこうした地道な積み重ねの連続ですが、一度パターンを覚えると次からは迷わなくなります。
コンテナを使ったレイアウト設計全体の体系についてはPower Apps コンテナ完全ガイドにまとめているので、より深く学びたい場合はそちらも参照してください。
