Тип QML Drawer

Боковая панель, которая может открываться и закрываться с помощью жеста свайпа. Подробнее...

• Список всех членов, включая унаследованные

Свойства

• dragMargin : real
• edge : перечисление
• interactive : bool
• position : real

Подробное описание

Drawer предоставляет боковую панель на основе свайпа, аналогичную тем, которые часто используются в сенсорных интерфейсах для предоставления центрального местоположения для навигации.

Drawer может быть размещён на любом из четырёх краёв элемента содержимого. Drawer выше размещён на левом краю окна. Drawer открывается путем «перетаскивания» его от левого края окна.

import QtQuick 2.7
import QtQuick.Controls 2.0

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 — это специальный тип Popup, который находится на одном из краёв окна. По умолчанию Drawer повторно родительствует себя к слою окна overlay и, следовательно, работает с координатами окна. Также можно вручную задать parent, чтобы drawer работал в определённом пространстве координат.

Drawer можно настроить таким образом, чтобы он занимал только часть края окна. Следующий пример иллюстрирует, как Drawer можно расположить, чтобы он отображался под заголовком окна:

import QtQuick 2.7
import QtQuick.Controls 2.0

ApplicationWindow {
    id: window
    visible: true

    header: ToolBar { }

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

Свойство position определяет, сколько Drawer будет видно, как значение между 0.0 и 1.0. Невозможно установить координату x (или горизонтальные отступы) Drawer на левом или правом краю окна, или координату y (или вертикальные отступы) Drawer на верхнем или нижнем краю окна.

На изображении выше содержимое приложения «перемещается» по экрану. Это достигается путём применения преобразования к содержимому:

import QtQuick 2.7
import QtQuick.Controls 2.1

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

Если вы хотите, чтобы содержимое приложения оставалось на месте при открытии drawer, не применяйте преобразование.

Drawer можно настроить как неоткрывающуюся постоянную боковую панель, сделав Drawer немодальным и неинтерактивным. Дополнительные сведения см. в примере Side Panel.

Примечание: На некоторых платформах определённые края могут быть зарезервированы для системных жестов и, следовательно, не могут быть использованы с Drawer. Например, верхний и нижний края могут быть зарезервированы для системных уведомлений и центров управления на Android и iOS.

См. также SwipeView, Настройка Drawer, Элементы управления навигацией и Элементы управления Popup.

Документация по свойствам

dragMargin : real

Это свойство содержит расстояние от края экрана, в пределах которого действия перетаскивания откроют Drawer. Установка значения до 0 или меньше предотвращает открытие Drawer с помощью перетаскивания.

Значение по умолчанию — Qt.styleHints.startDragDistance.

См. также interactive.

edge : перечисление

Это свойство содержит край окна, от которого будет открываться Drawer. Допустимые значения:

interactive : bool

Это свойство определяет, интерактивен ли drawer. Неинтерактивный drawer не реагирует на свайпы.

Значение по умолчанию — true.

Это свойство было добавлено в QtQuick.Controls 2.2 (Qt 5.9).

См. также dragMargin.

position : real

Это свойство содержит положение drawer относительно конечного пункта назначения. То есть, положение будет 0.0, когда drawer полностью закрыт, и 1.0, когда он полностью открыт.