Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to change shadow color of Qt QML Drawer (without declaring custom Style)?

I use Drawer from QtQuick.Controls 2.2

Drawer {
    id: drawer
    width: parent.width/2
    height: parent.height
    modal: true
    ...
}

With style:

[Controls]
Style=Material

[Material]
Theme=Dark
Accent=Red
Primary=#c64949

I want to change a color of the Drawer shadow. Style Material uses a white color for the shadow (that to the right of the open Drawer).

-- Edit by Bounty Sponsor --

I have discovered the shadow is defined, ie. here: http://code.qt.io/cgit/qt/qtquickcontrols2.git/tree/src/imports/controls/Drawer.qml

as:

T.Overlay.modal: Rectangle {
    color: Color.transparent(control.palette.shadow, 0.5)
}

T.Overlay.modeless: Rectangle {
    color: Color.transparent(control.palette.shadow, 0.12)
}

Without defining an entirely new Style, how can one modify them as one-off?

I presumably can redefine an entirely custom control.. but there ought to be a compatible version?

like image 454
Drew Dru Avatar asked Sep 24 '17 06:09

Drew Dru


1 Answers

What you are looking for is Overlay.modal property, as @Blabdouze mentioned. Simple working example:

import QtQuick 2.12
import QtQuick.Window 2.12
import QtQuick.Controls 2.5

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("test")

    Drawer {
        height: parent.height
        width: parent.width/2
        Rectangle {
            anchors.fill: parent
            color: "green"
        }

        Overlay.modal: Rectangle {
                  color: "red"
              }
    }
}

Default edge is left, so drag it from there.

Links:

Documentation

Drawer source code

like image 139
Maxim Skvortsov Avatar answered Nov 05 '22 07:11

Maxim Skvortsov