QML事件处理 八

1、MouseArea

MouseArea 是一个不可见的项目，通常用来和一个可见的项目配合使用来为其提供鼠标处理。鼠标处理的逻辑可以包含在一个MouseArea项目中。

MouseArea的enabled属性可以用来设置是否启用鼠标处理，值默认为true;

只读属性pressed表明了是否用户在MouseArea按住了鼠标按钮，这个属性经常用于属性绑定，可以实现在鼠标按下时执行一些操作。

只读的containsMouse属性表明了当前是否由鼠标光标在MouseArea上，默认的，只有鼠标的一个按钮处于按下状态才可以被检测到。

对于鼠标的位置好按钮单击等信息是用过信号提供的，可以使用事件处理器来获取，最常用的有onClicked(),onDoubleClicked(),onPressed()

onReleased()和onPressAndHold()等。

默认情况下，MouseArea项目只报告鼠标单击而不报告鼠标光标的位置改变，这个可以通过设置hoverEnabled属性来进行更改。这样onPositionChanged()、onEntered()和onExited()等处理函数都可以使用了。而且这时containsMouse属性也可以在没有鼠标按钮按下的情况下进行检查了。

1 2 3 4 5 6 7 8 9 10 11 12

Rectangle{     color:"blue"     border.color: "red"     border.width: 5     radius: 10     width:100;height:100       MouseArea{     anchors.fill:parent     onClicked: {parent.color = "red"}     }     }

　　方块从蓝变红。

1.1 MouseEvent

在很多MouseArea的信号中都包含了一个鼠标事件参数，例如MouseArea：：onClicked(MouseEvent mouse)。在MouseEvent对象中，可以通过x和y属性获取鼠标的位置；通过button属性可以获取按下的按键；通过modifiers属性可以获取按下的键盘修饰符等。

button值:Qt.LeftButton Qt.RightButton Qt.MiddleButton

modifiers值：由多个按键进行位组合而成，在使用是需要将modifiers与这些特殊的按键进行按位与来判断按键，常用的按键由Qt.NoModifier没有修饰键、Qt.ShiftModifier Qt.ContralModifier Qt.AltModifier.例子如下

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

MouseArea{ // mouse 作为clicked（）信号传进来的参数，在onClicked中使用  anchors.fill:parent  acceptedButtons: Qt.LeftButton|Qt.RightButton  onClicked: {      if(mouse.button == Qt.LeftButton)         {parent.color =  "blue";          console.debug("左键");}      else if((mouse.button == Qt.RightButton)              &&(mouse.modifiers & Qt.ShiftModifier))         { parent.color = "green";           console.debug("右键");}      else      {parent.color = "red";       console.debug(mouse.button);}    }  }

　　实现的功能是，当按下鼠标右键时，Rectangle变色。

1.2 拖拽功能

MouseArea中的drag分组属性提供了一个使项目可以拖拽的简便方法。

drag.target属性用来指定拖动的项目id;

drag.active属性获取项目当前是否正在被拖动的信息；

drag.axis属性用来指定属性的拖动方向（水平方向：Drag.XAxis 和 Drag.YAxis 或者 Drag.XandYAxis）;

drag.minimum和drag.maximum限制了项目在指定方向上拖动的距离。

举例如下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

Rectangle{      id:container  color:"blue"  width:400;height:200 Rectangle{ id:rect width:50; height:20; color:"red" opacity:(container.width-rect.x)/container.width   }  MouseArea{  anchors.fill:parent  drag.target: rect  drag.axis: Drag.XAxis  drag.minimumX: 0  drag.maximumX: contains.width-rect.width  }

　　drag作为mouse事件中的一个属性，可以指定一个目标，设定其可拖拽的功能。本例子中红色小方块可以进行水平拖动。并且在拖动的过程中，小方块的透明度会发生变化。

2 按键处理（与鼠标对应）

2.1按键处理概述

当用户按下或者释放一个按键，会按以下步骤进行处理：

第一步，Qt获取键盘动作并产生一个键盘事件

第二步，如果包好QDeclarativeView的Qt部件具有焦点（focus），那么键盘事件会传递给它，否则将进行常规的按键处理。

第三步，场景将键盘事件交给具有活动焦点的QML项目。如果没有项目具体活动焦点，键盘事件会被忽略，然后继续常规的按键处理。

第四步，如果具有活动焦点的QML项目接接受了该键盘事件，那么传播将停止。否则，改时间会递归的传递到每一个项目的副项目，直到被接受，或者到达根项目。

第五步，如果到达了根项目，该键盘事件会被忽略而继续常规的Qt按键处理。

所有的基于Item的可见元素都可以通过keys附加属性来进行按键处理。Keys附加属性提供了基本的处理器，例如onPressed和onReleased，也提供了对特殊按键的处理器。例如onCancelPressed。例如下面的代码：

1 2 3 4 5 6 7 8 9 10 11

Rectangle{     width: 100; height:100     focus:true     Keys.onPressed: {     if(event.key == Qt.Key_A)     {         console.log("key A was pressed");         event.accepted = true;     }     } }

　　使用Keys附加属性进行处理。event.accepted设置为true可以防止事件想上层项目传播。

活动焦点focus：当一个按键按下或者释放时，则产生一个键盘事件，并将其传递给获得由焦点的QML项目。

如果一个项目的focus属性为true，那么这个项目便会获得焦点。所以使用键盘事件前，先将focuss设置好。

2.2查询活动焦点项目

Item::activeFocus属性可以查询一个项目是否具有活动焦点。例如

Text{text:activeFocus?"I have active focus":"I dont have active focus"}

2.3 获取焦点和焦点作用域

正常一个Item项目可以设置focus属性获得焦点。但是当其作为组件时（例如上述例子Key_A）,简单的使用focus属性就不再有效。因为组件中的也存在focus为true的情况，所以引入焦点作用域FocusScope来解决该问题。在组件中使用FocusScope元素。

3.定时器

1 2 3 4 5 6 7 8 9

Timer{     interval:500; running:true;     repeat:true     onTriggered: time.text = Date().toString() }   Text{     id:time} }

　　定时器可以用来将一个动作在指定的事件间隔触发一次或者多次，在QML中使用Timer元素来表示一个定时器。例子中表示每隔500ms更新一次文本的显示。

interval属性：设置时间间隔，单位ms，默认1000ms

repeat属性：社则是否重复触发。如果是false则只触发一次并自动将running属性设置为false.默认值为false。

running属性：true开启定时器。默认false。

当定时器触发时会执行onTriggered（）信号处理函数，在这里可以定义一些操作；

Timer提供了一些函数，比如restart(),start()和stop()等。

4使用Loader动态加载组件

作用：对于拖延组件的创建是很用的。当一个组件需要在要求的时候被创建，或者当由于性能原因一个组件不应该被创建是。