Grid QML Type
子要素をグリッド状に配置します。詳細...
| Import Statement: | import QtQuick |
| Inherits: |
プロパティ
- add : Transition
- bottomPadding : real
- columnSpacing : real
- columns : int
- effectiveHorizontalItemAlignment : enumeration
- effectiveLayoutDirection : enumeration
- flow : enumeration
- horizontalItemAlignment : enumeration
- layoutDirection : enumeration
- leftPadding : real
- move : Transition
- padding : real
- populate : Transition
- rightPadding : real
- rowSpacing : real
- rows : int
- spacing : real
- topPadding : real
- verticalItemAlignment : enumeration
信号
方法
- void forceLayout()
詳細説明
Gridは、子要素をグリッド状に配置するタイプです。
Gridは、すべての子アイテムを収容できる十分な大きさのセルのグリッドを作成し、これらのアイテムを左から右、上から下へとセルに配置します。各アイテムは、位置 (0, 0) でそのセルの左上隅に配置されます。
Gridはデフォルトで4列となり、すべての子アイテムを収めるのに必要な行数を生成します。行数と列数は、rows およびcolumns プロパティを設定することで制限できます。
たとえば、以下はさまざまなサイズの5つの矩形を含むGridです:
import QtQuick
Grid {
columns: 3
spacing: 2
Rectangle { color: "red"; width: 50; height: 50 }
Rectangle { color: "green"; width: 20; height: 50 }
Rectangle { color: "blue"; width: 50; height: 20 }
Rectangle { color: "cyan"; width: 50; height: 50 }
Rectangle { color: "magenta"; width: 10; height: 10 }
}グリッドは、子アイテムを自動的にグリッド状に配置します:

Grid内のアイテムがvisible になっていない場合、または幅や高さが0の場合、そのアイテムはレイアウトされず、列内には表示されません。また、Gridは子アイテムを自動的に配置するため、Grid内の子アイテムは、x やy の位置を設定したり、anchor プロパティのいずれかを使用して自身をアンカーしたりしてはなりません。
Grid およびその他の関連する位置指定子の使用方法の詳細については、「アイテムの位置指定子」を参照してください。
「 Flow」 、「Row 」、「Column 」、「Positioner 」、「GridLayout」、および「Qt Quick Examples - Positioners」も参照してください 。
プロパティのドキュメント
add : Transition
このプロパティは、このポジショナーに追加されるアイテムに対して実行されるトランジションを保持します。ポジショナーの場合、これは以下の項目に適用されます:
- ポジショナーが作成された後、その子として作成されたり、親が変更されたりしたアイテム
- Item::visible プロパティがfalseからtrueに変更され、その結果表示されるようになった子アイテム
トランジションでは、ViewTransition プロパティを使用して、追加されるアイテムに関する詳細情報にアクセスできます。これらのトランジションの使用方法に関する詳細や例については、『ViewTransition 』のドキュメントを参照してください。
注:この 遷移は、ポジショナーの作成時点で既にポジショナーの一部となっているアイテムには適用されません。この場合、代わりに `populate ` 遷移が適用されます。
関連項目: populate 、ViewTransition 、およびQt Quick Examples - Positioners。
これらのプロパティは、コンテンツの周囲のパディングを指定します。
columnSpacing : real
このプロパティは、列間の間隔(ピクセル単位)を指定します。
このプロパティが設定されていない場合、列間隔にはデフォルトの値が使用されます。
デフォルトでは、このプロパティは設定されていません。
「rowSpacing」も参照してください 。
columns : int
このプロパティは、グリッドの列数を指定します。デフォルトの列数は 4 です。
グリッドに指定された列数を埋めるのに十分な項目がない場合、一部の列の幅はゼロになります。
effectiveHorizontalItemAlignment : enumeration [read-only]
horizontalItemAlignment : enumeration
verticalItemAlignment : enumeration
グリッド内の項目の水平および垂直方向の配置を設定します。デフォルトでは、項目は垂直方向に上揃えになります。水平方向の配置は、グリッドのlayoutDirection の設定に従います。たとえば、LeftToRightからlayoutDirection を設定している場合、項目は左揃えになります。
horizontalItemAlignment の有効な値は、Grid.AlignLeft 、Grid.AlignRight 、およびGrid.AlignHCenter です。
verticalItemAlignment の有効な値は、Grid.AlignTop 、Grid.AlignBottom 、Grid.AlignVCenter です。
以下の画像は、項目の配置方法の3つの例を示しています。
![]() | ![]() | ![]() | |
| 水平方向の配置 | AlignLeft | AlignHCenter | AlignHCenter |
| 垂直方向の配置 | 上揃え | 上揃え | AlignVCenter |
添付プロパティLayoutMirroring::enabled を使用するか、layoutDirection を設定してレイアウトをミラーリングする場合、項目の水平方向の配置も同様にミラーリングされます。ただし、horizontalItemAlignment プロパティは変更されません。項目の実際の水平方向の配置を確認するには、読み取り専用プロパティeffectiveHorizontalItemAlignment を使用してください。
「 Grid::layoutDirection 」および「LayoutMirroring 」も参照してください 。
effectiveLayoutDirection : enumeration [read-only]
このプロパティは、グリッドの有効なレイアウト方向を保持します。
ロケールレイアウトで添付プロパティ `LayoutMirroring::enabled ` を使用する場合、グリッドポジショナーの視覚的なレイアウト方向は反転します。ただし、プロパティ `layoutDirection ` の値は変更されません。
「 Grid::layoutDirection 」および「LayoutMirroring 」も参照してください 。
flow : enumeration
このプロパティは、レイアウトのフローを保持します。
指定可能な値は以下の通りです:
- Grid.LeftToRight(既定値) - 項目はlayoutDirection 内で隣り合って配置され、その後次の行に折り返されます。
- Grid.TopToBottom - アイテムは上から下へと並べて配置され、その後、次の列へと折り返されます。
layoutDirection : enumeration
このプロパティは、レイアウトの方向を指定します。
取り得る値は以下の通りです:
- Qt.LeftToRight (デフォルト) - アイテムは上から下へ、そして左から右へと配置されます。フローの方向は、Grid::flow プロパティに依存します。
- Qt.RightToLeft - アイテムは上から下へ、そして右から左へと配置されます。フローの方向は、Grid::flow プロパティに依存します。
「 Flow::layoutDirection 」および「Row::layoutDirection 」も参照してください 。
move : Transition
このプロパティは、ポジショナー内で移動したアイテムに対してトランジションを実行するように指定します。ポジショナーの場合、これは以下のアイテムに適用されます:
- ポジショナー内の他のアイテムの追加、削除、または再配置によって位置がずれた際に移動する子アイテム
- ポジショナー内の他のアイテムのサイズ変更により、位置が再配置される子アイテム
トランジションは、ViewTransition プロパティを使用して、移動中のアイテムに関する詳細情報にアクセスできます。ただし、この移動トランジションの場合、ViewTransition の.targetIndexesおよびViewTransition の.targetItemsリストは、ポジショナー内の他のアイテムの追加によってこのトランジションがトリガーされた場合にのみ設定されます。それ以外の場合は、これらのリストは空になります。 これらの遷移の使用に関する詳細や例については、『ViewTransition 』のドキュメントを参照してください。
また、 add 、populate 、ViewTransition 、およびQt Quick の「例 - ポジショナー」も参照してください 。
populate : Transition
このプロパティには、このポジショナーが作成された時点でその構成要素となっているアイテムに対して実行される遷移が格納されます。この遷移は、ポジショナーが最初に作成されたときに実行されます。
トランジションでは、ViewTransition プロパティを使用して、追加されるアイテムに関する詳細情報にアクセスできます。これらのトランジションの使用方法に関する詳細や例については、『ViewTransition 』のドキュメントを参照してください。
「 add 」、「ViewTransition 」、および「Qt Quick Examples - Positioners」も参照してください 。
rowSpacing : real
このプロパティは、行間の間隔(ピクセル単位)を指定します。
このプロパティが設定されていない場合、行間にはデフォルトの値が使用されます。
デフォルトでは、このプロパティは設定されていません。
「columnSpacing」も参照してください 。
rows : int
このプロパティは、グリッド内の行数を保持します。
グリッドに指定された行数を埋めるのに十分な項目がない場合、一部の行の幅はゼロになります。
spacing : real
間隔とは、隣接するアイテムの間に空くスペースの量(ピクセル単位)のことです。適用される間隔の量は、水平方向と垂直方向で同じになります。デフォルトの間隔は 0 です。
以下の例では、灰色の背景上に、赤、青、緑の長方形を含むグリッドを配置しています。グリッドポジショナーが占める領域は白で表示されています。左側のポジショナーは間隔なし(デフォルト)、右側のポジショナーは間隔 6 が設定されています。

Signal ドキュメント
positioningComplete()
このシグナルは、位置決めが完了したときに発信されます。
注: 対応するハンドラは onPositioningComplete です。
メソッドのドキュメント
void forceLayout()
Grid は通常、1 フレームごとに子要素の位置を決定します。つまり、スクリプトブロック内では、基盤となる子要素が変更されているにもかかわらず、Grid がまだそれに応じて更新されていない可能性があるということです。
このメソッドは、Gridに対し、子要素における未反映の変更に直ちに対応するよう強制します。
注:一般的に、メソッドはコンポーネントの処理が完了した後にのみ呼び出すべきです。
© 2026 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.


