Übersicht über den Compositor

Einführung

„Übersicht Compositor“ veranschaulicht die Auswahl und Aktivierung einer Anwendung aus einer Liste aktuell verbundener Clients.

Eine Einführung in die Grundlagen der Erstellung einer Qt Wayland Compositor mit Qt finden Sie im Beispiel „Minimal QML“.

Anwendungsraster

In diesem Beispiel unterstützt der Compositor zwei verschiedene Betriebsmodi:

• Einen Vollbildmodus, in dem ein einzelnes Anwendungsfenster das gesamte Compositor-Fenster einnimmt und interaktiv ist.
• Ein Übersichtsmodus, in dem alle Anwendungsfenster in einem Raster sichtbar sind. Durch Klicken auf ein Fenster im Raster wird dieses ausgewählt. Der Compositor wechselt in den Vollbildmodus und zeigt das ausgewählte Anwendungsfenster an.

Wenn ein Client eine Verbindung zum Compositor herstellt und eine Oberfläche der obersten Ebene erstellt, wird diese Oberfläche mit einer Shell-Erweiterung verbunden. Das Beispiel unterstützt nur die Erweiterung „ XdgShell “, daher stellt der Client eine Verbindung zu dieser her.

XdgShell {
    onToplevelCreated: (toplevel, xdgSurface) => {
        toplevels.append({xdgSurface});
        toplevel.sendFullscreen(Qt.size(win.pixelWidth, win.pixelHeight));
    }
}

Für jede Oberfläche weisen wir den Client an, diese als Vollbild zu konfigurieren. Zudem werden die Oberflächen einer „ ListModel “ hinzugefügt, um den Zugriff zu vereinfachen.

Dieses Modell wird von einer „ Repeater “-Erweiterung verwendet, um „ ShellSurfaceItems “ innerhalb eines „ Grid “ zu erstellen. Die „ Grid “-Komponente positioniert die Elemente in einem Raster.

Repeater {
    model: toplevels
    Item {
        width: win.width
        height: win.height
        ShellSurfaceItem {
            anchors.fill: parent
            shellSurface: xdgSurface
            onSurfaceDestroyed: toplevels.remove(index)
        }
        MouseArea {
            enabled: grid.overview
            anchors.fill: parent
            onClicked: {
                grid.selected = index;
                grid.overview = false;
            }
        }
    }
}

Für jedes der Elemente erstellen wir ein „ MouseArea “, das das Element abdeckt und alle Maus- und Touch-Eingaben abfängt. Dies ist nur aktiv, wenn sich der Compositor im Übersichtsmodus befindet, und aktiviert die Anwendung, auf die geklickt wurde.

Wechselt der Compositor in den Vollbildmodus, wird dieselbe „ Grid “-Komponente verwendet, jedoch so skaliert und verschoben, dass die einzeln ausgewählte Zelle das Fenster des Compositors ausfüllt. Die Idee dahinter ist, die ausgewählte Zelle zu „vergrößern“, sodass der Benutzer mit der darin enthaltenen Anwendung interagieren kann.

transform: [
    Scale {
        xScale: grid.overview ? (1.0/grid.columns) : 1
        yScale: grid.overview ? (1.0/grid.columns) : 1
        Behavior on xScale { PropertyAnimation { easing.type: Easing.InOutQuad; duration: 200 } }
        Behavior on yScale { PropertyAnimation { easing.type: Easing.InOutQuad; duration: 200 } }
    },
    Translate {
        x: grid.overview ? 0 : win.width * -grid.selectedColumn
        y: grid.overview ? 0 : win.height * -grid.selectedRow
        Behavior on x { PropertyAnimation { easing.type: Easing.InOutQuad; duration: 200 } }
        Behavior on y { PropertyAnimation { easing.type: Easing.InOutQuad; duration: 200 } }
    }
]

Am unteren Rand des Fensters befindet sich eine Schaltfläche, mit der zwischen den Modi umgeschaltet werden kann. Diese kann verwendet werden, um das Anwendungsraster wieder einzublenden, während sich der Compositor im Vollbildmodus befindet.

Dieses Beispiel zeigt eine Möglichkeit, wie der Compositor Clients in verschiedenen Modi visualisieren kann. Eine weitere Möglichkeit, ähnliche Effekte zu erzielen, besteht darin, mehrere „ Qt Quick “-Elemente zu erstellen, die auf dieselbe Oberfläche verweisen. Eine Demonstration finden Sie im Beispiel „Multi Output “.

Beispielprojekt @ code.qt.io