How to change QML ApplicationWindow Overlay size?

Question

Since Qt 5.10 it's possible setting up Overlay attached property for the Popup element. There is an example available here https://doc.qt.io/qt-5/qml-qtquick-controls2-overlay.html#modal-attached-prop . It's really useful for cases when there is a need for changing background for Popup having dim: property set to true. But there is no clue (at least for me) on how can I change Overlay size. For example, I have a custom ApplicationWindow overriding contents: property to be able drawing shadow over the window (my custom window doesn't have borders) and place MouseArea beyond borders to mimic the behavior of native windows. The sad part is - Overlay drawn over the entire window area that makes it ugly for the area beyond borders.

Does anyone knows a way to adjust overlay size (I mean background shadow at least) when using dim: property in Popup?

Here is a typical Popup code:

Popup {
        id: popupReleaseNotes
        x: Math.round(parent.width/2 - width/2)
        y: Math.round(parent.height/2 - height/2)
        closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
        modal: true
        dim: true
    }

Here you can see how it looks like in my app:

Overlay background goes over my custom boundaries, which means it's taking all the ApplicationWindow area. And this is what I'm trying to change. I didn't find any documented way so far.

Answer 1

I suggest you use ColorOverlay.

https://doc.qt.io/qt-5/qml-qtgraphicaleffects-coloroverlay.html

Anyway seems to me that you missed the Overlay.Modal. Reading the documentation(), I was expecting something like:

Popup {
        id: popupReleaseNotes
        x: Math.round(parent.width/2 - width/2)
        y: Math.round(parent.height/2 - height/2)
        closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutside
        modal: true

        visible: true

        Overlay.modal: Rectangle {
               anchors.fill: parent
               color: "#aacfdbe7"
        }
}

PS have a look to the Popup and its Layout in order to understand where it could be a problem of Content item vs Background. Maybe your dimming ha been done on the background that is bigger than the content. https://doc.qt.io/qt-5/qml-qtquick-controls2-popup.html