Qt-quick(qml) MouseArea包含的所有属性（properties）和信号（Signals）

MouseArea QML Type 

MouseArea

MouseArea是不可见的项目，通常与可见的item结合使用，以便为item提供鼠标事件处理。 通过有效地充当代理，在MouseArea的item中，包含鼠标处理逻辑。

properties

• acceptedButtons : Qt::MouseButtons

此属性保存鼠标区域响应的鼠标按钮，用来设置有效的鼠标按键，是枚举类型，默认值为Qt.LeftButton，还接受Qt.RightButton，Qt.MiddleButton，支持位与 “|” 操作符将以上三个键的组合形式。如果想要接受所有的鼠标按钮还可以使用Qt.AllButtons。通过modifiers属性可以设置获取按下的键盘修饰符，
       常用按键有：
               Qt.NoModifiers:                  没有修饰符被按下
               Qt.ShiftModifiers:Shift        Shift 被按下
               Qt.ControlModifiers:Ctrl      Ctrl 被按下
               Qt.AltModifiers:Alt               Alt 被按下
               Qt.MetaModifiers:Meta        Meta 键被按下
               Qt.KeypadModifiers:            小键盘按钮被按下

MouseArea { acceptedButtons: Qt.LeftButton | Qt.MiddleButton | Qt.RightButton }
MouseArea { acceptedButtons: Qt.AllButtons }

• containsMouse : bool

此属性表示鼠标当前是否在鼠标区域内。如果hoverenabled为false，则containsMouse仅在鼠标光标位于mousearea内时才有效。

• containsPress : bool

这个是Qt5.4新出现的属性，效果等同于“pressed && containsMouse”，用来判断鼠标是否按下。

• cursorShape : Qt::CursorShape

具体内容见：https://doc.qt.io/qt-5/qt.html#CursorShape-enum。枚举类型，用来设置光标形状，而不响应鼠标事件，默认是Qt.ArrowCursor。                                                

• drag      提供了一种使 item 可拖动的便捷方法。

  • drag.target : Item                  指定要拖动的item的ID。
  • drag.active : bool                  指定当前目标item是否正在被拖动。
  • drag.axis : enumeration        指定是否可以水平 Drag.XAxis 垂直 Drag.YAxis 或两个都 Drag.XAndYAxis 进行拖动
  • drag.minimumX : real           Drag.minimum 指定向相应方向可以拖动的最小和最大距离
  • drag.maximumX : real
  • drag.minimumY : real
  • drag.maximumY : real
  • drag.filterChildren : bool      如果drag.filterChildren设置为true，则可以拖动覆盖的后代MouseAreas。
  • drag.threshold : real             drag.threshold确定何时开始拖动操作的阈值（以像素为单位）。默认情况下，这绑定到平台相关的值。此属性是在Qt Quick 2.2中添加的。

• enabled : bool

bool类型，默认为true，用来设置当前对象是否响应鼠标事件，与Item元素的enabled属性不同，它只是对鼠标事件有效，不影响键盘事件和child对象。

• hoverEnabled : bool

此属性表示是否处理悬停事件，默认为 false ，只有按下鼠标键时才处理鼠标事件，为true时即使没有按下鼠标键也会作相应的处理。影响的是containsMouse属性和onEntered() ，onExited()，onPositionChanged()信号。

• mouseX : real

• mouseY : real

此属性保存当前鼠标的位置。如果 hoverEnabled 属性值为 false，则坐标只有在 pressed 和 released 时会被更新，默认为 false。如果 hoverEnabled 属性值为true，则只要鼠标在MouseArea都会记录, 在使用onwheel(滑轮)中如果需要记录鼠标的位置可以用到。

• pressAndHoldInterval : int

此属性表示pressAndHold触发前，需要等待的时间间隔。此属性在Qt 5.9中引入。

• pressed : bool

只读属性表示在MouseArea区域上是否有鼠标按钮按下，这个属性一般用于属性绑定，当鼠标按下时会执行相应的操作。

• pressedButtons : MouseButtons

此属性保留当前按下的鼠标按钮，它包含以下各项的按位组合：Qt.LeftButton，Qt.RightButton，Qt.MiddleButton。此属性仅处理 acceptedButtons 中指定的按钮。

• preventStealing : bool

bool类型，默认为false，为true时可以防止当前鼠标事件被其它对象（例如，父类对象）拦截。

• propagateComposedEvents : bool

此属性保存组合的鼠标事件是否将自动传播到与此MouseArea重叠，但在视觉堆叠顺序中较低的其他MouseArea 。默认情况下，此属性为false。

• scrollGestureEnabled : bool

此属性控制此MouseArea是否响应非鼠标设备的滚动手势，例如触控板上的两指轻弹手势。如果将其设置为false，则仅当wheel事件来自实际的带有滚轮的鼠标时才会发出wheel信号，而滚动手势事件将传递到任何其他将处理它们的Item。

Signals

• canceled()

当鼠标事件没有被接受或是被其他元素截获时，onCanceled() 会被调用。当有多个 MouseArea 处理输入时，或是Flickable元素中包含一个MouseArea时，onCanceled()会显得特别重要。如果在Flickable元素中包含一个MouseArea时，当执行一些针对于按下信号的逻辑处理然后又拖动鼠标时，Flickable会从MouseArea中截获鼠标事件。在这种情况下，当Flickable截获了  Mouse Area 的鼠标事件时需要重置逻辑。

• clicked(mouse)

当有鼠标单击事件（在MouseArea中按下，并紧接着弹起）发生时，MouseArea::onClicked方法会被调用。

• doubleClicked(mouse)

当有双击事件（按下紧接着弹起然后再按下）发生时调用。在MouseArea::onDoubleClicked中，如果将accepted属性设置
为假，则在第二次单击时onPressed、onReleased、onClicked仍会被调用，否则在第二次单击时onPressed、onReleased、
onClicked不会被调用。

• entered()

当鼠标进入MouseArea中时，MouseArea::onEntered()会被调用。默认情况下，只有当鼠标在MouseArea中单击时才会调用，可如果将hoverEnabled设置为真，当鼠标拖动至MouseArea时也会调用onEntered();

• exited()

当鼠标退出鼠标区域时，将发出此信号。默认情况下，仅在当前按下按钮时才发出此信号。将hoverEnabled设置为true即可发出此信号，即使没有按下鼠标按钮也是如此。

• positionChanged(mouse)

当鼠标位置发生改变时会调用onPositionChanged，在这个方法中不会考虑MouseEvent参数的accepted属性，也就是说所有的鼠标事件在这里都会被处理，并不会因为某个鼠标事件被拒绝了而不做处理。默认情况下，仅在当前按下按钮时才发出此信号。将hoverEnabled设置为true即可发出此信号，即使没有按下鼠标按钮也是如此。对应的处理程序是onPositionChanged。

• pressAndHold(mouse)

长按（当前为800ms）时会触发此信号，调用onPressAndHold（）。

• pressed(mouse)

当有鼠标按下时onPressed会被调用。MouseEvent类型的参数提供有关按下时的鼠标信息，包括鼠标的位置以及按下时对应的鼠标按键。参数mouse的accepted属性决定了MouseArea是否要处理这个鼠标事件。如果mouse的accept属性被设置为假则直到下一个按下事件发生，这这间任何鼠标事件都不会发送给MouseArea。

• released(mouse)

当有鼠标按下时onPressed会被调用。MouseEvent类型的参数提供有关按下时的鼠标信息，包括鼠标的位置以及按下时对应的鼠标按键。参数mouse的accepted属性决定了MouseArea是否要处理这个鼠标事件。

• wheel(wheel)

响应鼠标滚轮和触控板的滚动手势而发出此信号，调用onWheel。MouseEvent类型的参数提供有关按下时的鼠标信息，包括鼠标的位置以及按下时对应的鼠标按键。参数mouse的accepted属性决定了MouseArea是否要处理这个鼠标事件。

MouseArea 教程及演示

运行环境：win10 + Qt5.10

1.下面的示例在一个Rectangle中使用MouseArea，当单击该矩形时，它将Rectangle颜色更改为红色。

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Rectangle {
        width: 100; height: 100
        color: "green"

        MouseArea {
            anchors.fill: parent
            onClicked: { parent.color = 'red' }
        }
    }
}

效果如下：

 对上述内容进行扩展，当右键单击该区域时，该扩展产生不同的颜色：

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Rectangle {
        width: 100; height: 100
        color: "green"

        MouseArea {
            anchors.fill: parent
            acceptedButtons: Qt.LeftButton | Qt.RightButton
            onClicked: {
                if (mouse.button == Qt.RightButton)
                    parent.color = 'blue';
                else
                    parent.color = 'red';
            }
        }
    }
}

效果如下：

2.  下面的示例显示一个可以沿X轴拖动的矩形，当矩形向右拖动时，其不透明度会降低：

import QtQuick 2.9
import QtQuick.Window 2.2



Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Rectangle {
        id: container
        color: "blue"
        width: 600; height: 200

        Rectangle {
            id: rect
            width: 50; height: 50
            color: "red"
            opacity: (600.0 - rect.x) / 600       //渐变色

            MouseArea {
                anchors.fill: parent
                drag.target: rect
                drag.axis: Drag.XAxisYAxis
                drag.minimumX: 0
                drag.maximumX: container.width - rect.width  //限制拖动的极值
//                drag.minimumY: 0
//                drag.maximumY: container.height - rect.height
            }
        }
    }

}

效果如下：

3. 如果drag.filterChildren设置为true，则拖动可以覆盖后代MouseAreas。例如，这使父级MouseArea可以处理拖动，而后代可以处理点击。如果将drag.filterChildren设为 false 则在黄色区域将无法拖动两个方块。

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Rectangle {
        width: 480
        height: 320
        Rectangle {
            x: 30; y: 30
            width: 300; height: 240
            color: "lightsteelblue"

            MouseArea {
                anchors.fill: parent
                drag.target: parent;
                drag.axis: "XAxis"
                drag.minimumX: 30
                drag.maximumX: 150
                drag.filterChildren: true

                Rectangle {
                    color: "yellow"
                    x: 50; y : 50
                    width: 100; height: 100
                    MouseArea {
                        anchors.fill: parent
                        onClicked: console.log("Clicked")
                    }
                }
            }
        }
    }
}

效果如下：

4. 下面是黄色的矩形包含一个蓝色的矩形。蓝色矩形是视觉堆叠顺序层次结构中最顶层的项目，它将在黄色矩形上方直观地呈现。由于蓝色矩形将propertyComposedEvents设置为true，并且将所有接收到的事件传播到其下方黄色矩形的MouseAre中。

import QtQuick 2.9
import QtQuick.Window 2.2

Window {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")

    Rectangle {
        color: "yellow"
        width: 100; height: 100

        MouseArea {
            anchors.fill: parent
            onClicked: console.log("clicked yellow")
        }

        Rectangle {
            color: "blue"
            width: 50; height: 50

            MouseArea {
                anchors.fill: parent
                propagateComposedEvents: true
                //propagateComposedEvents: false
                onClicked: {
                    console.log("clicked blue")
                    mouse.accepted = false
                }
            }
        }
    }

}

效果如下：