Grid QML Type

Ordnet seine untergeordneten Elemente in einer Rasteranordnung an. Mehr...

• Liste aller Elemente, einschließlich der vererbten Elemente

Eigenschaften

• 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

Signale

• positioningComplete()

Methoden

• void forceLayout()

Ausführliche Beschreibung

„Grid“ ist ein Typ, der seine untergeordneten Elemente in einer Rasteranordnung positioniert.

Ein „Grid“ erstellt ein Raster aus Zellen, das groß genug ist, um alle untergeordneten Elemente aufzunehmen, und ordnet diese Elemente von links nach rechts und von oben nach unten in den Zellen an. Jedes Element wird in der oberen linken Ecke seiner Zelle mit der Position (0, 0) positioniert.

Ein Grid hat standardmäßig vier Spalten und erstellt so viele Zeilen, wie nötig sind, um alle untergeordneten Elemente unterzubringen. Die Anzahl der Zeilen und Spalten kann durch Festlegen der Eigenschaften „ rows “ und „ columns “ begrenzt werden.

Im folgenden Beispiel ist ein Raster zu sehen, das fünf Rechtecke unterschiedlicher Größe enthält:

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 }
}

Das Raster positioniert die untergeordneten Elemente automatisch in einer Rasteranordnung:

Wenn ein Element innerhalb eines „Grid“ nicht „ visible “ ist oder eine Breite oder Höhe von 0 hat, wird das Element nicht angeordnet und ist innerhalb der Spalte nicht sichtbar. Da ein „Grid“ seine untergeordneten Elemente automatisch positioniert, sollte ein untergeordnetes Element innerhalb eines „Grid“ außerdem weder seine Positionen „ x “ oder „ y “ festlegen noch sich mit einer der „ anchor “-Eigenschaften verankern.

Weitere Informationen zur Verwendung von „Grid“ und anderen verwandten Positionierungstypen finden Sie unter „Item Positioners“.

Siehe auch „ Flow“ , „ Row “, „ Column “, „ Positioner “, „ GridLayout “ und „Qt Quick “ – Beispiele: Positionierer.

Dokumentation zu Eigenschaften

add : Transition

Diese Eigenschaft enthält den Übergang, der für Elemente ausgeführt werden soll, die diesem Positionierer hinzugefügt werden. Für einen Positionierer gilt dies für:

• Elemente, die nach der Erstellung des Positionierers als untergeordnete Elemente des Positionierers erstellt oder neu zugeordnet werden
• Unterobjekte, deren Eigenschaft „ Item::visible “ von „false“ auf „true“ geändert wird und die somit nun sichtbar sind

Der Übergang kann über die Eigenschaft „ ViewTransition “ auf weitere Details zum hinzugefügten Element zugreifen. Weitere Informationen und Beispiele zur Verwendung dieser Übergänge finden Sie in der Dokumentation unter „ ViewTransition “.

Siehe auch „ populate“ , „ ViewTransition “ und „Qt Quick: Beispiele – Positioner“.

Diese Eigenschaften legen den Abstand um den Inhalt herum fest.

columnSpacing : real

Diese Eigenschaft legt den Abstand zwischen den Spalten in Pixeln fest.

Wenn diese Eigenschaft nicht festgelegt ist, wird der Abstand für den Spaltenabstand verwendet.

Standardmäßig ist diese Eigenschaft nicht festgelegt.

Siehe auch „ rowSpacing “.

columns : int

Diese Eigenschaft gibt die Anzahl der Spalten im Raster an. Die Standardanzahl der Spalten beträgt 4.

Wenn das Raster nicht genügend Elemente enthält, um die angegebene Anzahl an Spalten zu füllen, haben einige Spalten die Breite Null.

Legt die horizontale und vertikale Ausrichtung der Elemente im Raster fest. Standardmäßig sind die Elemente vertikal oben ausgerichtet. Die horizontale Ausrichtung richtet sich nach der „ layoutDirection “ des Rasters; wenn beispielsweise die „ layoutDirection “ auf „LeftToRight“ gesetzt ist, werden die Elemente links ausgerichtet.

Gültige Werte für „ horizontalItemAlignment “ sind „ Grid.AlignLeft “, „ Grid.AlignRight “ und „ Grid.AlignHCenter “.

Die gültigen Werte für „ verticalItemAlignment “ sind „ Grid.AlignTop “, „ Grid.AlignBottom “ und „ Grid.AlignVCenter “.

Die folgenden Abbildungen zeigen drei Beispiele für die Ausrichtung von Elementen.

Horizontale Ausrichtung	AlignLeft	AlignHCenter	AlignHCenter
Vertikale Ausrichtung	Oben ausrichten	Oben ausrichten	AlignVCenter

Wenn das Layout entweder mithilfe der angehängten Eigenschaft „ LayoutMirroring::enabled “ oder durch Setzen der Eigenschaft „ layoutDirection “ gespiegelt wird, wird auch die horizontale Ausrichtung der Elemente gespiegelt. Die Eigenschaft „ horizontalItemAlignment “ bleibt jedoch unverändert. Um die tatsächliche horizontale Ausrichtung der Elemente abzufragen, verwenden Sie die schreibgeschützte Eigenschaft „ effectiveHorizontalItemAlignment “.

Siehe auch „ Grid::layoutDirection “ und „ LayoutMirroring “.

effectiveLayoutDirection : enumeration [read-only]

Diese Eigenschaft gibt die tatsächliche Layout-Richtung des Rasters an.

Bei Verwendung der angehängten Eigenschaft „ LayoutMirroring::enabled “ für lokalisierte Layouts wird die visuelle Ausrichtungsrichtung des Rasterpositionierers gespiegelt. Die Eigenschaft „ layoutDirection “ bleibt jedoch unverändert.

Siehe auch „ Grid::layoutDirection “ und „ LayoutMirroring “.

flow : enumeration

Diese Eigenschaft bestimmt den Ablauf des Layouts.

Mögliche Werte sind:

• Grid.LeftToRight (Standard) – Elemente werden nebeneinander im „ layoutDirection “ angeordnet und anschließend in die nächste Zeile umgebrochen.
• Grid.TopToBottom – Elemente werden von oben nach unten nebeneinander angeordnet und anschließend in die nächste Spalte umgebrochen.

layoutDirection : enumeration

Diese Eigenschaft gibt die Ausrichtungsrichtung des Layouts an.

Mögliche Werte sind:

• Qt.LeftToRight (Standard) – Elemente werden von oben nach unten und von links nach rechts angeordnet. Die Fließrichtung hängt von der Eigenschaft „ Grid::flow “ ab.
• Qt.RightToLeft – Elemente werden von oben nach unten und von rechts nach links angeordnet. Die Fließrichtung hängt von der Eigenschaft „ Grid::flow “ ab.

Siehe auch „ Flow::layoutDirection “ und „ Row::layoutDirection “.

move : Transition

Diese Eigenschaft legt fest, dass der Übergang für Elemente ausgeführt wird, die sich innerhalb des Positionierers verschoben haben. Für einen Positionierer gilt dies für:

• Untergeordnete Elemente, die sich verschieben, wenn sie durch das Hinzufügen, Entfernen oder Neuanordnen anderer Elemente im Positionierer verschoben werden
• Untergeordnete Elemente, die aufgrund der Größenänderung anderer Elemente im Positionierer neu positioniert werden

Der Übergang kann die Eigenschaft „ ViewTransition “ verwenden, um auf weitere Details zu dem Element zuzugreifen, das verschoben wird. Beachten Sie jedoch, dass bei diesem „move“-Übergang die Listen „ ViewTransition.targetIndexes“ und „ ViewTransition.targetItems“ nur dann gesetzt werden, wenn dieser Übergang durch das Hinzufügen anderer Elemente im Positionierer ausgelöst wird; in anderen Fällen sind diese Listen leer. Weitere Details und Beispiele zur Verwendung dieser Übergänge finden Sie in der Dokumentation unter ViewTransition.

Siehe auch add, populate, ViewTransition und Qt Quick – Beispiele: Positionierer.

populate : Transition

Diese Eigenschaft enthält den Übergang, der für Elemente ausgeführt werden soll, die zum Zeitpunkt der Erstellung Teil dieses Positioners sind. Der Übergang wird ausgeführt, wenn der Positioner zum ersten Mal erstellt wird.

Der Übergang kann die Eigenschaft „ ViewTransition “ verwenden, um auf weitere Details zum hinzugefügten Element zuzugreifen. Weitere Informationen und Beispiele zur Verwendung dieser Übergänge finden Sie in der Dokumentation unter ViewTransition.

Siehe auch „ add “, „ ViewTransition “ und „Qt Quick -Beispiele – Positioner“.

rowSpacing : real

Diese Eigenschaft legt den Abstand zwischen den Zeilen in Pixeln fest.

Wenn diese Eigenschaft nicht festgelegt ist, wird der Abstand für den Zeilenabstand verwendet.

Standardmäßig ist diese Eigenschaft nicht festgelegt.

Siehe auch „ columnSpacing “.

rows : int

Diese Eigenschaft gibt die Anzahl der Zeilen im Raster an.

Wenn das Raster nicht genügend Elemente enthält, um die angegebene Anzahl an Zeilen zu füllen, haben einige Zeilen eine Breite von Null.

spacing : real

Der Abstand ist der in Pixeln angegebene Freiraum zwischen benachbarten Elementen. Der angewendete Abstand ist in horizontaler und vertikaler Richtung gleich. Der Standardabstand beträgt 0.

Im folgenden Beispiel wird ein Raster mit einem roten, einem blauen und einem grünen Rechteck auf einem grauen Hintergrund platziert. Der Bereich, den der Raster-Positionierer einnimmt, ist weiß gefärbt. Der Positionierer auf der linken Seite hat keinen Abstand (Standardeinstellung), während der Positionierer auf der rechten Seite einen Abstand von 6 aufweist.

Siehe auch rows und columns.

Signal-Dokumentation

positioningComplete()

Dieses Signal wird ausgegeben, wenn die Positionierung abgeschlossen ist.

Methodendokumentation

void forceLayout()

Das Grid positioniert seine untergeordneten Elemente in der Regel einmal pro Frame. Das bedeutet, dass sich innerhalb von Skriptblöcken die zugrunde liegenden untergeordneten Elemente möglicherweise geändert haben, das Grid jedoch noch nicht entsprechend aktualisiert wurde.

Diese Methode zwingt das Grid, sofort auf alle ausstehenden Änderungen an seinen untergeordneten Elementen zu reagieren.

Hinweis: Methoden sollten generell erst aufgerufen werden, nachdem die Komponente fertiggestellt ist.