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动态加载组件
作用:对于拖延组件的创建是很用的。当一个组件需要在要求的时候被创建,或者当由于性能原因一个组件不应该被创建是。