首页 文章

QML - MouseArea / MouseEvent问题

提问于
浏览
3

下面的代码生成一个包含红色矩形和灰色矩形的白色矩形 . 每个矩形都有一个关联的MouseArea . 当鼠标在其中单击时,灰色矩形变为蓝色 . 红色矩形在鼠标光标进入其中时打印控制台消息,在发出释放信号时打印另一条消息 .

我想要:

  • 按住灰色矩形内的鼠标按钮(变为蓝色)

  • 将光标移动到灰色/蓝色矩形外,然后移到红色矩形内,不释放按钮并捕获红色矩形的输入信号

  • 释放光标位于红色矩形内的按钮,并捕获红色矩形的释放信号 .

可能吗?使用当前代码,只有在进入时未按下mopuse按钮时才会发出红色矩形的输入信号,并且只有在该矩形内按下按钮时才会发出释放的信号 . 显而易见的问题是,如果在那里按下按钮,灰色/蓝色矩形将控制鼠标事件 .

这是我正在开发的应用程序中的类似但简化的场景 .

import QtQuick 2.0

Rectangle{
    color: "white"
    height: 210
    width: 500

    MouseArea{
      id: mainMa
      anchors.fill: parent
      hoverEnabled: true
      onReleased:{console.log("white-released")}
   }

   Column{
       spacing: 10
       Rectangle{
           color: "red"
           height: 100
           width: 500
          MouseArea{
             anchors.fill: parent
             hoverEnabled: true
             propagateComposedEvents: true
             onEntered:{console.log("red-enter")}
             onReleased:{console.log("red-released")}
          }
       }

       Rectangle{
           color: "#666666"
           height: 100
           width: 500
           MouseArea{
               id: ma
               anchors.fill: parent
               hoverEnabled: true
               onPressed: {parent.color = "blue"; console.log("grey pressed")}
               onReleased: {parent.color = "#666666"; console.log("grey released")}
           }
       }
   }

}

1 回答

  • 6

    我想你想要拖放操作 . 为此,在红色矩形中添加DropArea,在灰色矩形中添加活动拖动

    类似的东西(最小代码):

    Rectangle {
        Column {
            Rectangle {
                id: redRect
                DropArea {
                    anchors.fill: parent
                    onEntered: { console.log("red-enter") }
                    onDropped: { console.log("red-released") }
                }
            }
            Rectangle {
                id: greyRect
                Drag.active: mousearea.drag.active
                Drag.hotSpot.x: mousearea.mouseX
                Drag.hotSpot.y: mousearea.mouseY
                MouseArea {
                    id: mousearea
                    anchors.fill: parent
                    onReleased: parent.Drag.drop()
                    drag.target: parent
                }
            }
        }
    }
    

    如果您不想移动灰色矩形,可以添加不可见的可拖动项:

    MouseArea {
        id: mousearea
        anchors.fill: parent
        onReleased: dargItem.Drag.drop()
        drag.target: dargItem
        Item {
            id: dargItem
            x: mousearea.mouseX
            y: mousearea.mouseY
            width: 1; height: 1
            Drag.active: mousearea.drag.active
            Drag.hotSpot.x: 1
            Drag.hotSpot.y: 1
        }                    
    }
    

相关问题