Wichtige Konzepte in „ Qt Quick “ – Positionierung

Visuelle Elemente in QML können auf verschiedene Arten positioniert werden. Das wichtigste Konzept im Zusammenhang mit der Positionierung ist das der Verankerung, eine Form der relativen Positionierung, bei der Elemente an bestimmten Grenzen aneinander verankert (oder befestigt) werden können. Weitere Positionierungskonzepte sind die absolute Positionierung, die Positionierung mit Koordinatenbindungen, Positionierer und Layouts.

Manuelle Positionierung

Elemente können manuell positioniert werden. Wenn die Benutzeroberfläche statisch sein soll, stellt die manuelle Positionierung die effizienteste Form der Positionierung dar.

In jeder Benutzeroberfläche befinden sich die visuellen Elemente zu jedem Zeitpunkt an einer bestimmten Stelle im Bildschirmkoordinatensystem. Während flüssig animierte und dynamische Benutzeroberflächen einen Schwerpunkt von „ Qt Quick “ bilden, sind statisch positionierte Benutzeroberflächen nach wie vor eine praktikable Option. Wenn sich die Position dieser Elemente zudem nicht ändert, ist es oft leistungsfähiger, die Position manuell festzulegen, als die in den folgenden Abschnitten beschriebenen dynamischeren Positionierungsmethoden zu verwenden.

In „ Qt Quick “ wird jedes visuelle Objekt innerhalb des Koordinatensystems positioniert, das von der visuellen Arbeitsfläche „ Qt Quick “ bereitgestellt wird. Wie in diesem Dokument beschrieben, beziehen sich die x- und y-Koordinaten eines visuellen Objekts auf die seines visuellen übergeordneten Objekts, wobei die obere linke Ecke die Koordinate (0, 0) hat.

Das folgende Beispiel zeigt daher zwei manuell positionierte Rechtecke:

import QtQuick 2.0

Item {
    width: 200
    height: 200

    Rectangle {
        x: 50
        y: 50
        width: 100
        height: 100
        color: "green"
     }

     Rectangle {
        x: 100
        y: 100
        width: 50
        height: 50
        color: "yellow"
     }
}

Positionierung mit Bindungen

Elemente können auch positioniert werden, indem Bindungsausdrücke den Eigenschaften zugewiesen werden, die mit ihrer Position auf der visuellen Arbeitsfläche zusammenhängen. Diese Art der Positionierung ist am dynamischsten, allerdings ist die Positionierung von Elementen auf diese Weise mit einem gewissen Leistungsaufwand verbunden.

Die Position und die Abmessungen eines visuellen Objekts können ebenfalls über Eigenschaftsbindungen festgelegt werden. Dies hat den Vorteil, dass die Werte automatisch aktualisiert werden, sobald sich die Abhängigkeiten der Bindungen ändern. Beispielsweise könnte die Breite eines Rechtecks von der Breite des daneben liegenden Rechtecks abhängen.

Zwar bieten Bindungen eine sehr flexible und intuitive Möglichkeit, dynamische Layouts zu erstellen, doch ist zu beachten, dass damit gewisse Leistungseinbußen verbunden sind; daher sollten, wo immer möglich, reine Anchor-Layouts bevorzugt werden.

Anker

Anker ermöglichen es, ein Element entweder neben oder innerhalb eines anderen zu platzieren, indem einer oder mehrere Ankerpunkte (Ränder) des Elements an einen Ankerpunkt des anderen Elements gebunden werden. Diese Anker bleiben auch dann bestehen, wenn sich die Abmessungen oder die Position eines der Elemente ändern, was hochdynamische Benutzeroberflächen ermöglicht.

Man kann sich ein visuelles Objekt so vorstellen, dass es verschiedene Ankerpunkte (oder genauer gesagt Ankerlinien) besitzt. Andere Elemente können an diesen Punkten verankert werden, was bedeutet, dass sich die anderen Objekte, die daran verankert sind, automatisch anpassen, wenn sich ein Objekt ändert, um die Verankerung aufrechtzuerhalten.

Qt Quick bietet Verankerungen als übergeordnetes Konzept. Ausführliche Informationen zu diesem Thema finden Sie in der Dokumentation zur Positionierung mit Verankerungen.

Es ist wichtig zu beachten, dass ankerbasierte Layouts im Allgemeinen weitaus leistungsfähiger sind als bindungsbasierte Layouts, sofern sie „unverfälscht“ sind. Ein „unverfälschtes“ Anker-Layout ist eines, das zur Bestimmung der Positionierung ausschließlich Anker (mit Objektverschachtelung) verwendet, während ein „verfälschtes“ Anker-Layout sowohl Verankerungen als auch Bindungen nutzt (entweder an positionsbezogenen [x,y]-Eigenschaften oder an dimensionsbezogenen [width,height]-Eigenschaften) zur Bestimmung der Position verwendet.

Positionierer

Qt Quick bietet zudem einige integrierte Positionierungselemente. Für viele Anwendungsfälle ist ein einfaches Raster, eine Zeile oder eine Spalte die beste Wahl, und „ Qt Quick “ stellt Elemente bereit, die untergeordnete Elemente auf möglichst effiziente Weise in diesen Formationen positionieren. Weitere Informationen zur Verwendung vordefinierter Positionierungselemente finden Sie in der Dokumentation zu den Positionierungstypen.

Layouts

Ab Qt 5.1 kann das Modul Qt Quick Layouts kann auch zum Anordnen von „ Qt Quick “-Elementen in einer Benutzeroberfläche verwendet werden. Im Gegensatz zu Positionierern verwalten die Typen in „ Qt Quick Layouts “ sowohl die Positionen als auch die Größen der Elemente in einer deklarativen Schnittstelle. Sie eignen sich gut für skalierbare Benutzeroberflächen.

Unterstützung für Rechts-nach-Links-Schrift

Die Schreibrichtung einer Sprache hat oft großen Einfluss darauf, wie die visuellen Elemente einer Benutzeroberfläche positioniert werden sollten. „ Qt Quick “ unterstützt die Positionierung von Elementen von rechts nach links sowohl über vordefinierte Layouts als auch über Textlayouts von rechts nach links.

Ausführliche Informationen zu diesem Thema finden Sie in der Dokumentation zur Unterstützung der Rechts-nach-Links-Ausrichtung in „ Qt Quick “.