QML - MouseArea / MouseEvent问题

时间:2013-09-26 15:16:50

标签: qt mouse mouseevent qml qtquick2

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

我想:

  1. 按住鼠标按钮进入灰色矩形(变为蓝色)
  2. 将光标移动到灰色/蓝色矩形外,然后移到红色矩形内,不释放按钮并捕获红色矩形的输入信号
  3. 释放光标位于红色矩形内的按钮,并捕获红色矩形的释放信号。
  4. 有可能吗?使用当前代码,只有在进入时未按下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 个答案:

答案 0 :(得分: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
    }                    
}