qml - QML：按下鼠标区域并悬停

Question

对于我正在开发的应用程序，我绝对需要一件小事：我必须能够将一个对象拖到另一个对象上，并且至少其中一个应该注意到它们是相交的。所以，我的问题是其中一项必须接受 onEntered 信号，即使鼠标在外面按下。

例如：

import QtQuick 1.0

Rectangle{
    id: base
    width: 500
    height: 500
    MouseArea{ //Even without this mousearea I don't get what i want.
        anchors.fill: parent
        //onPressed:{console.log("big")}
    }

    Rectangle{
       id: t
       width: 100
       height: 100
       color: "red"
       MouseArea{
          anchors.fill: parent
          hoverEnabled: true
          onPressed:{console.log("little-press")}
          onEntered:{console.log("little-enter")}
          drag.target: t
       }
     }
}

我想要的是在红色方块外按下鼠标按钮，然后在不释放按钮的情况下移动它。当鼠标经过红色矩形时，我希望发出 onEntered 信号。我不明白为什么不发出它，因为 onEntered 应该只关心鼠标区域内的鼠标，而不是按钮。

知道怎么做吗？

非常感谢。

Answer 1

您的代码不起作用，因为此时一个鼠标区域将位于另一个鼠标区域之上，鼠标事件将仅由位于顶部的鼠标区域进行（直到您修改了窃取属性等）。因此，您的底部矩形的属性（如悬停等）将不起作用，因为所有这些事件都将被顶部矩形捕获。

而是试试这个：

import QtQuick 1.0

Rectangle
{
    id: topParent
    width: 500
    height: 500
    color: "grey"


    Rectangle
    {
        id: redRectangle
        color: "red"
        width:  80
        height: 80

        onXChanged:
        {
            if(   redRectangle.x  > greenRectangle.x - redRectangle.width
                  && redRectangle.x  < greenRectangle.x + greenRectangle.width
                  && redRectangle.y  > greenRectangle.y - redRectangle.height
                  && redRectangle.y  < greenRectangle.y + greenRectangle.height

               )

            {
                console.log ( "Red Over Green" )
            }
        }

        MouseArea
        {
          anchors.fill: parent
          drag.target: redRectangle
          drag.axis: Drag.XandYAxis
          drag.minimumX: 0
          drag.maximumX: topParent.width
          drag.minimumY: 0
          drag.maximumY: topParent.height
          onPressed: redRectangle.z = greenRectangle.z + 1
        }
    }

    Rectangle
    {
        id: greenRectangle
        color: "green"
        width: 180
        height: 180

        onXChanged:
        {
            if(   greenRectangle.x  > redRectangle.x - greenRectangle.width
                  && greenRectangle.x  < redRectangle.x + redRectangle.width
                  && greenRectangle.y  > redRectangle.y - greenRectangle.height
                  && greenRectangle.y  < redRectangle.y + redRectangle.height

               )


            {
                console.log ( "Green Over Red" )
            }
        }

        MouseArea
        {
          anchors.fill: parent
          drag.target: greenRectangle
          drag.axis: Drag.XandYAxis
          drag.minimumX: 0
          drag.maximumX: topParent.width
          drag.minimumY: 0
          drag.maximumY: topParent.height
          onPressed: greenRectangle.z = redRectangle.z + 1
        }
    }
}

在我打印消息的地方，您也可以发出信号。