Drawer QML Type

Panel lateral que puede abrirse y cerrarse con un gesto de deslizamiento. Más...

• Lista de todos los miembros, incluidos los heredados

Propiedades

• dragMargin : real
• edge : enumeration
• interactive : bool (since QtQuick.Controls 2.2 (Qt 5.9))
• position : real

Descripción detallada

Drawer proporciona un panel lateral basado en deslizamiento, similar a los utilizados a menudo en interfaces táctiles para proporcionar una ubicación central para la navegación.

El cajón puede situarse en cualquiera de los cuatro bordes del elemento de contenido. El cajón de arriba está situado contra el borde izquierdo de la ventana. El cajón se abre "arrastrándolo" desde el borde izquierdo de la ventana.

import QtQuick
import QtQuick.Controls

ApplicationWindow {
    id: window
    visible: true

    Drawer {
        id: drawer
        width: 0.66 * window.width
        height: window.height

        Label {
            text: "Content goes here!"
            anchors.centerIn: parent
        }
    }
}

Drawer es un tipo especial de ventana emergente que reside en uno de los bordes de la ventana edges. Por defecto, el cajón se reubica en la ventana overlay y, por tanto, funciona en las coordenadas de la ventana. También es posible configurar manualmente el parent a otra cosa para hacer que el cajón opere en un espacio de coordenadas específico.

Drawer puede configurarse para cubrir sólo una parte del borde de su ventana. El siguiente ejemplo ilustra cómo puede posicionarse el cajón para que aparezca debajo de la cabecera de una ventana:

import QtQuick
import QtQuick.Controls

ApplicationWindow {
    id: window
    visible: true

    header: ToolBar { }

    Drawer {
        y: header.height
        width: window.width * 0.6
        height: window.height - header.height
    }
}

La propiedad position determina qué parte del cajón es visible, como un valor entre 0.0 y 1.0. No es posible establecer la coordenada x (o márgenes horizontales) de un cajón en el borde izquierdo o derecho de la ventana, ni la coordenada y (o márgenes verticales) de un cajón en el borde superior o inferior de la ventana.

En la imagen anterior, el contenido de la aplicación se "empuja" a través de la pantalla. Esto se consigue aplicando una traslación a los contenidos:

import QtQuick
import QtQuick.Controls

ApplicationWindow {
    id: window
    width: 200
    height: 228
    visible: true

    Drawer {
        id: drawer
        width: 0.66 * window.width
        height: window.height
    }

    Label {
        id: content

        text: "Aa"
        font.pixelSize: 96
        anchors.fill: parent
        verticalAlignment: Label.AlignVCenter
        horizontalAlignment: Label.AlignHCenter

        transform: Translate {
            x: drawer.position * content.width * 0.33
        }
    }
}

Si desea que el contenido de la aplicación permanezca donde está cuando se abre el cajón, no aplique una traslación.

El cajón puede configurarse como un panel lateral persistente no cerrable haciendo que el cajón sea non-modal y non-interactive. Consulte el ejemplo Galería para obtener más detalles.

Consulte también SwipeView, Personalización de Drawer, Controles de navegación y Controles emergentes.

Documentación de propiedades

dragMargin : real

Esta propiedad mantiene la distancia desde el borde de la pantalla dentro de la cual las acciones de arrastre abrirán el cajón. Establecer el valor a 0 o menos impide abrir el cajón al arrastrar.

El valor por defecto es Application.styleHints.startDragDistance.

Véase también interactive.

edge : enumeration

Esta propiedad contiene el borde de la ventana desde el que se abrirá el cajón. Los valores aceptables son:

interactive : bool [since QtQuick.Controls 2.2 (Qt 5.9)]

Esta propiedad indica si el cajón es interactivo. Un cajón no interactivo no reacciona a los deslizamientos.

El valor por defecto es true.

Esta propiedad se introdujo en QtQuick.Controls 2.2 (Qt 5.9).

Véase también dragMargin.

position : real

Esta propiedad mantiene la posición del cajón respecto a su destino final. Es decir, la posición será 0.0 cuando el cajón esté completamente cerrado, y 1.0 cuando esté completamente abierto.