How can I return resize logic of borders in Frameless Window?

The frame windows has this logic:

Code in QML:

import QtQuick
import QtQuick.Controls 2.5
import Qt5Compat.GraphicalEffects
import NR 1.0

Window {
    id: mainWindow
    width: 640
    height: 720
    visible: true
    title: qsTr("Hello World")
    flags: Qt.Window | Qt.FramelessWindowHint
    color: "transparent"

    // (1)

    MouseArea {
        id: bottomArea
        height: 5
        anchors {
            bottom: parent.bottom
            left: parent.left
            right: parent.right
        }
        cursorShape: Qt.SizeVerCursor

        onPressed: {
            previousY = mouseY
        }

        onm ouseYChanged: {
            var dy = mouseY - previousY
            mainWindow.setHeight(mainWindow.height   dy)
        }
    }
    // Some code of another Items here
}

I tried this code for left side:

 MouseArea {
        id: leftSideMouseArea
        anchors.fill: parent
        property point lastMousePos: Qt.point(0, 0)
        onPressed: { lastMousePos = Qt.point(mouseX, mouseY); }
        onm ouseXChanged: mainWindow.width  = (mouseX   lastMousePos.x)
    }

I put this code in (1) place, but it doesn't work - on click (without move) windows resize to the rigth and app crashes with error:

QQuickPaintedItem::textureProvider: can only be queried on the rendering thread of an exposed window

This looks like on picture:

Can you help me?

Thanks!

CodePudding user response：

I can't think of better way to do this

Here is a working example:

import QtQuick 2.15
import QtQuick.Window 2.15

Window {
    id: window
    width: 640
    height: 480
    visible: true
    title: qsTr("Hello World")
    flags: Qt.Window | Qt.FramelessWindowHint

    Rectangle
    {
        id: dragItemRight
        anchors.top: parent.top
        anchors.bottom: parent.bottom
        width: 5
        color: "red"
        x: window.width - width

        onXChanged:
        {
            if (dragItemRightMouse.drag.active)
            {
                window.width = dragItemRight.x   width
            }
        }

        MouseArea
        {
            id: dragItemRightMouse
            anchors.fill: parent
            drag.target: parent
            drag.axis: Drag.XAxis
            cursorShape: Qt.SizeHorCursor
            drag.minimumX: 300

            drag.onActiveChanged:
            {
                if (!drag.active)
                {
                    dragItemRight.x = Qt.binding(function() { return window.width - width })
                }
            }
        }
    }

    Rectangle
    {
        id: dragItemBottom
        anchors.left: parent.left
        anchors.right: parent.right
        height: 5
        color: "red"
        y: window.height - height

        onYChanged:
        {
            if (dragItemBottomMouse.drag.active)
            {
                window.height = dragItemBottom.y   height
            }
        }

        MouseArea
        {
            id: dragItemBottomMouse
            anchors.fill: parent
            drag.target: parent
            drag.axis: Drag.YAxis
            cursorShape: Qt.SizeVerCursor
            drag.minimumY: 300

            drag.onActiveChanged:
            {
                if (!drag.active)
                {
                    dragItemBottom.y = Qt.binding(function() { return window.height - height })
                }
            }
        }
    }

    Rectangle
    {
        id: dragItemBottomRight
        width: 5
        height: 5
        color: "green"
        x: window.width - width
        y: window.height - height

        onYChanged:
        {
            if (dragItemBottomRightMouse.drag.active)
            {
                window.height = dragItemBottomRight.y   height
            }
        }
        onXChanged:
        {
            if (dragItemBottomRightMouse.drag.active)
            {
                window.width = dragItemBottomRight.x   width
            }
        }

        MouseArea
        {
            id: dragItemBottomRightMouse
            anchors.fill: parent
            drag.target: parent
            drag.axis: Drag.XAndYAxis
            drag.minimumX: 300
            drag.minimumY: 300
            cursorShape: Qt.SizeFDiagCursor

            drag.onActiveChanged:
            {
                if (!drag.active)
                {
                    dragItemBottomRight.x = Qt.binding(function() { return window.width - width })
                    dragItemBottomRight.y = Qt.binding(function() { return window.height - height })
                }
            }
        }
    }
}

CodePudding user response：

I found the solution:

import QtQuick
import QtQuick.Controls 2.15
import Qt5Compat.GraphicalEffects
import NR 1.0

Window {
    id: mainWindow
    width: 640
    height: 720
    visible: true
    title: qsTr("Hello World")
    flags: Qt.Window | Qt.FramelessWindowHint
    color: "transparent"

    property point startMousePos
    property point startWindowPos
    property size startWindowSize

    function absoluteMousePos(mouseArea) {
        var windowAbs = mouseArea.mapToItem(null, mouseArea.mouseX, mouseArea.mouseY)
        return Qt.point(windowAbs.x   mainWindow.x,
                        windowAbs.y   mainWindow.y)
    }

    

    MouseArea {
        id: moveArea
        anchors.fill: title
        property point mPos;
        onPressed: {
            mPos = Qt.point(mouseX, mouseY)
        }
        onPositionChanged: {
            mainWindow.setX(mainWindow.x   mouseX - mPos.x)
            mainWindow.setY(mainWindow.y   mouseY - mPos.y)
        }
    }

    MouseArea {
        id: leftArea
        anchors.top: parent.top
        anchors.topMargin: 48
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 5
        cursorShape: Qt.SizeHorCursor
        width: 5
        onPressed: {
            startMousePos = absoluteMousePos(leftArea)
            startWindowPos = Qt.point(mainWindow.x, mainWindow.y)
            startWindowSize = Qt.size(mainWindow.width, mainWindow.height)
        }
        onm ouseXChanged: {
            var abs = absoluteMousePos(leftArea)
            var newWidth = Math.max(mainWindow.minimumWidth, startWindowSize.width - (abs.x - startMousePos.x))
            var newX = startWindowPos.x - (newWidth - startWindowSize.width)
            mainWindow.x = newX
            mainWindow.width = newWidth
        }

        Rectangle {
            anchors.fill: parent
            color: "red"
        }
    }

    MouseArea {
        id: rightArea
        width: 5
        x: parent.width - rightArea.width
        anchors.right: parent.rigth
        anchors.top: parent.top
        anchors.rightMargin: 5
        anchors.topMargin: 48
        anchors.bottom: parent.bottom
        anchors.bottomMargin: 5
        cursorShape: Qt.SizeHorCursor

        onPressed: {
            startMousePos = absoluteMousePos(rightArea)
            startWindowPos = Qt.point(mainWindow.x, mainWindow.y)
            startWindowSize = Qt.size(mainWindow.width, mainWindow.height)
        }
        onm ouseXChanged: {
            var abs = absoluteMousePos(rightArea)
            var newWidth = Math.max(mainWindow.minimumWidth, startWindowSize.width   (abs.x - startMousePos.x))
            mainWindow.width = newWidth
        }

        Rectangle {
            anchors.fill: parent
            color: "red"
        }
    }

    MouseArea {
        id: buttonArea
        y: parent.height - buttonArea.height
        height: 5
        anchors.leftMargin: 5
        anchors.left: parent.left
        anchors.rightMargin: 5
        anchors.right: parent.right
        anchors.bottom: parent.bottom
        cursorShape: Qt.SizeVerCursor

        onPressed: {
            startMousePos = absoluteMousePos(buttonArea)
            startWindowPos = Qt.point(mainWindow.x, mainWindow.y)
            startWindowSize = Qt.size(mainWindow.width, mainWindow.height)
        }
        onm ouseYChanged: {
            var abs = absoluteMousePos(buttonArea)
            var newHeight = Math.max(mainWindow.minimumHeight, startWindowSize.height   (abs.y - startMousePos.y))
            mainWindow.height = newHeight
        }

        Rectangle {
            anchors.fill: parent
            color: "red"
        }
    }

}