Visión general del Compositor

Introducción

El Compositor General muestra cómo seleccionar y activar una aplicación desde una red de clientes conectados.

Para una introducción a los principios básicos de la creación de una aplicación Qt Wayland Compositor con Qt, vea el ejemplo Mínimo QML.

Parrilla de aplicaciones

En este ejemplo, el compositor admite dos modos de funcionamiento diferentes:

• Un modo de pantalla completa, en el que una única ventana de aplicación ocupa toda la ventana del compositor y es interactiva.
• Un modo de vista general, en el que todas las ventanas de la aplicación son visibles en una cuadrícula. Al hacer clic en una ventana de la cuadrícula, se selecciona. El compositor entra en modo de pantalla completa, mostrando la ventana de la aplicación seleccionada.

Cuando un cliente se conecta al compositor y crea una superficie de nivel superior, la superficie se conectará a una extensión shell. El ejemplo sólo soporta la extensión XdgShell, por lo que el cliente se conectará a ésta.

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

Para cada superficie, le decimos al cliente que la configure como pantalla completa. Además, las superficies se añaden a ListModel para facilitar el acceso.

Este modelo es utilizado por un Repeater para crear ShellSurfaceItems dentro de un Grid. El componente Grid posiciona los elementos en una cuadrícula.

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

Para cada uno de los elementos, creamos un MouseArea que cubre el elemento e intercepta todas las entradas táctiles y del ratón. Esto sólo está activo cuando el compositor está en modo de vista general, y activa la aplicación en la que se hizo clic.

Cuando el compositor pasa al modo de pantalla completa, se utiliza el mismo componente Grid, pero se escala y se traslada a una posición en la que la única celda seleccionada llena la ventana del compositor. La idea es "ampliar" la celda seleccionada, permitiendo al usuario interactuar con la aplicación que contiene.

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

En la parte inferior de la ventana hay un botón que permite alternar entre los modos. Puede utilizarse para volver a la rejilla de la aplicación mientras el compositor está en modo de pantalla completa.

Este ejemplo muestra una forma de hacer que el compositor visualice a los clientes en diferentes modos. Otra forma de conseguir efectos similares es crear múltiples elementos Qt Quick que hagan referencia a la misma superficie. Vea el ejemplo Multi Output para una demostración.

Proyecto de ejemplo @ code.qt.io