Search code examples
qtqmlqt6

How to draw element above drawer?


I am trying to place a button above a drawer, like in Windows Calculator:

1

but it doesn't work.

Any solutions for this?

UPD: I've updated this post and added an example gif that shows what I'm trying to achieve.

ToolButton {
        id: drawerButton

        width: 32
        height: 32
        // trying to place above this object
        z: 100

        anchors {
            left: drawerPopUp.left
            leftMargin: 5
            top: drawerPopUp.top
            topMargin: 5
        }
}

Drawer {
        id: drawerPopUp
        // trying to place below this object
        z: -1

        width: root.width * 0.35
        height: root.height

        edge: Qt.LeftEdge
        interactive: true
}

Solution

  • From the Qt documentation you can read that the Drawer automatically reparents itself to Overlay, which is above all the other elements. Therefore you would need to add a button to the overlay itself as well.

    import QtQuick.Controls 2.4
    
    ApplicationWindow {
        ...
    
        ToolButton {
            ...
            parent: Overlay.overlay
            ...
        }
    }
    

    This might get awkward if you are doing more complex stuff, so you might have to copy the button, one in the normal way and one on the overlay