网站首页 > 博客文章 正文
在Qt编程时需要对事件进行处理,如对鼠标事件、键盘事件等的处理。在QML编程中同样需要对鼠标、键盘等事件进行处理。因为QML程序更多的是用于实现触摸式用户界面,所以更多的是对鼠标(在触屏设备上可能是手指)单击的处理。
与以前的窗口部件不同,在QML中如果一个元素想要处理鼠标事件,则要在其上放置一个MouseArea元素,也就是说,用户只能在MouseArea确定的范围内进行鼠标的动作。
本文实例使用MouseArea接受和响应鼠标单击、拖曳等事件,运行效果如下图所示。
具体实现步骤如下。
(1) 新建项目
新建QML应用程序,项目名称为“MouseArea”。
(2) 自定义组件
右击项目视图“Resources”-“qml.qrc”下的“/”节点,选择“Add New...”项,新建“Rect.qml”文件,编写代码如下:
import QtQuick 2.0
Rectangle { // 定义一个矩形元素
width: 50; height: 50 //宽和高都是 50
color: "teal" //初始为蓝绿色
MouseArea { //定义MouseArea元素处理鼠标事件
anchors.fill: parent //事件响应区充满整个矩形
/*拖曳属性设置*/ //(a)
drag.target: parent
drag.axis: Drag.XAxis
drag.minimumX: 0
drag.maximumX: 360 - parent.width
acceptedButtons: Qt.LeftButton | Qt.RightButton //(b)
onClicked: { //处理鼠标事件的代码
if(mouse.button === Qt.RightButton) { //(c)
/*设置矩形为蓝色并缩小尺寸*/
parent.color = "blue";
parent.width -= 5;
parent.height -= 5;
}else if((mouse.button === Qt.LeftButton) &&
(mouse.modifiers & Qt.ShiftModifier)){ // (d)
/*把矩形重新设为蓝绿色并恢复原来的大小*/
parent.color = "teal";
parent.width = 50;
parent.height = 50;
}else {
/*设置矩形为绿色并增大尺寸*/
parent.color = "green";
parent.width += 5;
parent.height += 5;
}
}
}
}
其中,
- (a) /*拖曳属性设置*/: MouseArea中的drag分组属性提供了一个使元素可被拖曳的简便方法。drag.target属性用来指定被拖曳的元素的id (这里为parent表示被拖曳的就是所在元素本身);drag.active属性获取元素当前是否正在被拖曳的信息;drag.axis属性用来指定拖曳的方向,可以是水平方向(Drag.XAxis)、垂直方向(Drag.YAxis)或者两个方向都可以(Drag.XandYAxis); drag.minimumX和drag.maximumX限制了元素在指定方向上被拖曳的范围。
- (b) acceptedButtons: Qt.LeftButton | Qt.RightButton: MouseArea所能接受的鼠标按键,可取的值有QtLeftButton (鼠标左键)、Qt.RightButton (鼠标右键)和Qt.MiddleButton (鼠标中键)。
- (c) mouse.button:为MouseArea信号中所包含的鼠标事件参数,其中mouse为鼠标事件对象,可以通过它的x和y属性获取鼠标当前的位置;通过button属性获取按下的按键。
- (d) mouse.modifiers & Qt.ShiftModifier:通过modifiers属性可以获取按下的键盘修饰符,modifiers的值由多个按键进行位组合而成,在使用时需要将modifiers与这些特殊的按键进行按位与来判断按键,常用的按键有Qt.NoModifier (没有修饰键)、Qt.ShiftModifier (一个Shift键)、Qt.ControlModifier (一个Ctrl键)、Qt.AltModifier (一个Alt键)。
(3) 主程序
打开“main.qml”文件,编写代码如下:
import QtQuick 2.12
import QtQuick.Window 2.12
Window {
width: 390
height: 150
visible: true
title: qsTr("MouseArea")
Rectangle {
width: 360
height: 360
anchors.fill: parent
Rect { //复用定义好的矩形元素
x: 25; y: 25 //初始坐标
opacity:(360.0 - x)/360 //透明度设置
}
}
}
这样就可以用鼠标水平地拖曳这个矩形,并且在拖曳过程中,矩形的透明度是随X坐标位置的改变而不断变化的。
————————————————
觉得有用的话请关注点赞,谢谢您的支持!
对于本系列文章相关示例完整代码有需要的朋友,可关注并在评论区留言!
猜你喜欢
- 2024-09-29 Qt的6个简单小案例(qt官方例子)
- 2024-09-29 Qt入门阶段之事件(qt入门阶段之事件是什么)
- 2024-09-29 Qt编写安防视频监控系统9-自动隐藏光标
- 2024-09-29 Qt为什么站稳c++GUI的top1(qt quuid)
- 2024-09-29 Qt5 事件(event)机制详解(qt事件是通过什么实现的)
- 2024-09-29 Qt 保持GUI响应的几种方法(qt保存快捷键)
- 2024-09-29 Qt如何模拟鼠标点击?(qt 模拟鼠标点击)
- 2024-09-29 Qt事件的接受与忽略(qt菜单栏按钮点击事件)
- 2024-09-29 「VTK」「DICOM」修改后的VTK sample code
- 2024-09-29 Qt事件(qt事件与信号槽)
你 发表评论:
欢迎- 最近发表
-
- 给3D Slicer添加Python第三方插件库
- Python自动化——pytest常用插件详解
- Pycharm下安装MicroPython Tools插件(ESP32开发板)
- IntelliJ IDEA 2025.1.3 发布(idea 2020)
- IDEA+Continue插件+DeepSeek:开发者效率飙升的「三体组合」!
- Cursor:提升Python开发效率的必备IDE及插件安装指南
- 日本旅行时想借厕所、买香烟怎么办?便利商店里能解决大问题!
- 11天!日本史上最长黄金周来了!旅游万金句总结!
- 北川景子&DAIGO缘定1.11 召开记者会宣布结婚
- PIKO‘PPAP’ 洗脑歌登上美国告示牌
- 标签列表
-
- ifneq (61)
- messagesource (56)
- aspose.pdf破解版 (56)
- promise.race (63)
- 2019cad序列号和密钥激活码 (62)
- window.performance (66)
- qt删除文件夹 (72)
- mysqlcaching_sha2_password (64)
- ubuntu升级gcc (58)
- nacos启动失败 (64)
- ssh-add (70)
- jwt漏洞 (58)
- macos14下载 (58)
- yarnnode (62)
- abstractqueuedsynchronizer (64)
- source~/.bashrc没有那个文件或目录 (65)
- springboot整合activiti工作流 (70)
- jmeter插件下载 (61)
- 抓包分析 (60)
- idea创建mavenweb项目 (65)
- vue回到顶部 (57)
- qcombobox样式表 (68)
- vue数组concat (56)
- tomcatundertow (58)
- pastemac (61)
本文暂时没有评论,来添加一个吧(●'◡'●)