QQuickDrawerPositioner Class Reference

Side panel that can be opened and closed using a swipe gesture. More...

Inheritance diagram for QQuickDrawerPositioner:

Collaboration diagram for QQuickDrawerPositioner:

Public Member Functions
	QQuickDrawerPositioner (QQuickDrawer *drawer)
void	reposition () override
Public Member Functions inherited from QQuickPopupPositioner
	QQuickPopupPositioner (QQuickPopup *popup)
	~QQuickPopupPositioner ()
QQuickPopup *	popup () const
QQuickItem *	parentItem () const
void	setParentItem (QQuickItem *parent)
Public Member Functions inherited from QQuickItemChangeListener
virtual	~QQuickItemChangeListener ()
virtual void	itemSiblingOrderChanged (QQuickItem *)
virtual void	itemVisibilityChanged (QQuickItem *)
virtual void	itemEnabledChanged (QQuickItem *)
virtual void	itemOpacityChanged (QQuickItem *)
virtual void	itemDestroyed (QQuickItem *)
virtual void	itemChildAdded (QQuickItem *, QQuickItem *)
virtual void	itemRotationChanged (QQuickItem *)
virtual void	itemImplicitWidthChanged (QQuickItem *)
virtual void	itemImplicitHeightChanged (QQuickItem *)
virtual void	itemFocusChanged (QQuickItem *, Qt::FocusReason)
virtual QQuickAnchorsPrivate *	anchorPrivate ()

Additional Inherited Members
Protected Member Functions inherited from QQuickPopupPositioner
void	itemGeometryChanged (QQuickItem *, QQuickGeometryChange, const QRectF &) override
void	itemParentChanged (QQuickItem *, QQuickItem *parent) override
void	itemChildRemoved (QQuickItem *, QQuickItem *child) override
void	removeAncestorListeners (QQuickItem *item)
void	addAncestorListeners (QQuickItem *item)
Protected Attributes inherited from QQuickPopupPositioner
bool	m_positioning = false
QQuickItem *	m_parentItem = nullptr
QQuickPopup *	m_popup = nullptr
qreal	m_popupScale = 1.0

Detailed Description

Side panel that can be opened and closed using a swipe gesture.

\qmltype Drawer
\inherits Popup

! \instantiates QQuickDrawer \inqmlmodule QtQuick.Controls

Since

5.7

Drawer provides a swipe-based side panel, similar to those often used in touch interfaces to provide a central location for navigation.

Drawer can be positioned at any of the four edges of the content item. The drawer above is positioned against the left edge of the window. The drawer is then opened by "dragging" it out from the left edge of the window.

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 is a special type of popup that resides at one of the window \l {edge}{edges}. By default, Drawer re-parents itself to the window overlay, and therefore operates on window coordinates. It is also possible to manually set the \l{Popup::}{parent} to something else to make the drawer operate in a specific coordinate space.

Drawer can be configured to cover only part of its window edge. The following example illustrates how Drawer can be positioned to appear below a window header:

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

The \l position property determines how much of the drawer is visible, as a value between 0.0 and 1.0. It is not possible to set the x-coordinate (or horizontal margins) of a drawer at the left or right window edge, or the y-coordinate (or vertical margins) of a drawer at the top or bottom window edge.

In the image above, the application's contents are "pushed" across the screen. This is achieved by applying a translation to the contents:

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

If you would like the application's contents to stay where they are when the drawer is opened, don't apply a translation.

Drawer can be configured as a non-closable persistent side panel by making the Drawer \l {Popup::modal}{non-modal} and \l {interactive} {non-interactive}. See the \l {Qt Quick Controls 2 - Gallery}{Gallery} example for more details.

Note

On some platforms, certain edges may be reserved for system gestures and therefore cannot be used with Drawer. For example, the top and bottom edges may be reserved for system notifications and control centers on Android and iOS.

See also

SwipeView, {Customizing Drawer}, {Navigation Controls}, {Popup Controls}

Definition at line 142 of file qquickdrawer.cpp.

Constructor & Destructor Documentation

QQuickDrawerPositioner()

QQuickDrawerPositioner::QQuickDrawerPositioner ( QQuickDrawer * drawer )

inline

Definition at line 145 of file qquickdrawer.cpp.

Member Function Documentation

reposition()

void QQuickDrawerPositioner::reposition ( )

overridevirtual

Reimplemented from QQuickPopupPositioner.

Definition at line 200 of file qquickdrawer.cpp.

References Qt::BottomEdge, QQuickItem::height, Qt::LeftEdge, QQuickPopupPositioner::m_positioning, QQuickPopupPositioner::popup(), position(), QQuickPopupPositioner::reposition(), Qt::RightEdge, QQuickItem::setX(), QQuickItem::setY(), Qt::TopEdge, QQuickItem::width, and window().

Here is the call graph for this function:

---

The documentation for this class was generated from the following file:

• qtdeclarative/src/quicktemplates/qquickdrawer.cpp (c61525f3aaa59f8de2e9b090c25ba739f097cec0)