[Interest] QML version of QRubberBand

[Alexander Ivash]

I've made some experiments and got basic rubber band working using
additional QML Window. But the issue I confronted is that
transparency/opacity on Windows 7 (and Windows 10) seems to be broken.
As soon as I start re-sizing area, opacity and transparency seems to
be reset and instead of nice semi-transparent rectangle I see ugly
opaque items... I can only hope I'm doing something wrong otherwise
seems like major issue in Qt :( Just in case, here is the code of
'main.qml':


import QtQuick 2.5
import QtQuick.Window 2.2
import QtQuick.Controls 1.4


Window {
    id: root
    visible: true
    Button {
        text: "show rubber"
        onClicked: {
            root.visible = false
            var rubberBand = rubberBandFactory.createObject(null);
            rubberBand.visible = true
            rubberBand.onAreaSelected.connect(function(x, y, w, h) {
                console.log(x, y, w, h)
                root.visible = true
            })
        }
    }


    property var rubberBandFactory: Component {

        Window {
            id: rubber
            visible: true
            flags: Qt.FramelessWindowHint | Qt.Popup
            modality: Qt.NonModal
            width: Screen.width
            height: Screen.height
            color: "red"
            opacity: 0.2

            signal areaSelected(int x, int y, int width, int height);
            property bool initialPosSelected: false;

            MouseArea {
                id: mouseArea
                anchors.fill: parent
                hoverEnabled: false

                onPressed: {
                    marker.x = mouseArea.mouseX
                    marker.y = mouseArea.mouseY
                    hoverEnabled = true;
                }


                onPositionChanged: {
                    marker.width = mouseArea.mouseX - marker.x
                    marker.height = mouseArea.mouseY - marker.y
                }


                onReleased: {
                    hoverEnabled = false
                    rubber.visible = false
                    areaSelected(marker.x, marker.y, marker.width,
marker.height)
                }
            }


            Rectangle {
                id: marker
                width: 0
                height: 0
                color: 'green'
            }
        }
    }
}


2016-04-12 20:06 GMT+03:00 Alexander Ivash <elderorb at gmail.com>:
>> You'll want a background MouseArea, and onMouseDown, you locate the Rectangle x,y, and on mouseMove, you adjust the height and width per the new mouse   > location minus, the y and x.
>> I've not one a "rubberband" per se, just a background swipe gesture, but it should work the same.
>
>
> Thank you for quick reply, but do I _have_to_ create separate
> invisible top-level QML Window as it can be done in other way? Lets
> say I have small window 200x200 px
> with a button which should make rubberband visible and screen with
> resolution 1024x768. After appearing rubberband should allow to select
> any part of the whole screen and not only 200x200 area.
>
>
> 2016-04-12 18:21 GMT+03:00 Jason H <jhihn at gmx.com>:
>> You'll want a background MouseArea, and onMouseDown, you locate the Rectangle x,y, and on mouseMove, you adjust the height and width per the new mouse location minus, the y and x.
>> I've not one a "rubberband" per se, just a background swipe gesture, but it should work the same.
>>
>>
>>> Sent: Tuesday, April 12, 2016 at 5:57 AM
>>> From: "Alexander Ivash" <elderorb at gmail.com>
>>> To: "interest at qt-project.org" <interest at qt-project.org>
>>> Subject: [Interest] QML version of QRubberBand
>>>
>>> Is it possible to implement QML version of QRubberBand ? I mean fully
>>> QML, without any widgets dependency?
>>>
>>> I understand it is trivial to make draggable area inside QML window.
>>> But what about draggable area over the whole screen? Should I create
>>> separate invisible QML window with the geometry of the screen and just
>>> put draggable rectangle inside or better approach exists?
>>>
>>> Alexander
>>> _______________________________________________
>>> Interest mailing list
>>> Interest at qt-project.org
>>> http://lists.qt-project.org/mailman/listinfo/interest
>>>