QML 鼠标和键盘事件

学习目标:Qml 鼠标和键盘事件

学习内容

1、QML 鼠标事件处理QML 直接提供 MouseArea 来捕获鼠标事件,该操作必须配合Rectangle 获取指定区域内的鼠标事件,

2、QML 键盘事件处理,并且获取对OML直接通过键盘事件 Keys 监控键盘任意按键应的消息。

项目效果

键盘事件

鼠标事件

项目代码

键盘事件

javascript 复制代码
import QtQuick 2.12
import QtQuick.Window 2.12

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


    Rectangle{
        id:keyserctn
        anchors.centerIn: parent

        width: 450
        height: 200
        color: "green"

        // 不设置焦点,获取不了键盘事件
        focus: true

        //捕获键盘按键事件。
        Keys.onPressed: {
            //按下的按键的键值 相当于枚举的值 d:68
            console.log("key:"+event.key)
            //按下的按键的原生扫描码。 "A" 时,event.nativeScanCode 的值通常是 30。
            console.log("scancode:"+event.nativeScanCode)
            //按下的按键所对应的文本字符
            console.log("text:"+event.text)
        }
        //捕获特殊 tab键
        Keys.onTabPressed: {
            console.log("监控区域提示:你已经按下Tab键!")
        }
        //捕获特殊 空格键
        Keys.onSpacePressed: {
            console.log("监控区域提示:你已经按下空格键!")
        }
    }
}

鼠标事件

javascript 复制代码
import QtQuick 2.12
import QtQuick.Window 2.12

import QtQuick.Controls 2.0

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


    Rectangle{
        id :mouse
        anchors.centerIn: parent

        width: 450
        height: 200
        color: "red"

        radius: width/2

        //鼠标事件
        MouseArea{
            anchors.fill: parent //沾满
            //接受的按钮:全部
            acceptedButtons: Qt.AllButtons

            // 此属性为false,鼠标进入、离开、移动不能捕获到
            hoverEnabled: true

            onPositionChanged: {
                console.log("监控区域提示:你当前鼠标移动坐标为:("+mouseX+","+mouseY+")");
            }

            onClicked: {
                if(mouse.button===Qt.LeftButton){
                    console.log("监控区域提示:你已经按下鼠标左键!");
                }
                else if(mouse.button===Qt.RightButton){
                    console.log("监控区域提示:你已经按下鼠标右键!");
                }
                else if(mouse.button===Qt.MidButton){
                    console.log("监控区域提示:你已经按下鼠标中间键!");
                }
            }
            onDoubleClicked: {
                 console.log("监控区域提示:你已经双击按下鼠标!");
            }
        }

    }

}
最后附上源代码链接

对您有帮助的话,帮忙点个star

Qt demo: 学习qt过程 (gitee.com)

相关推荐
百锦再14 小时前
重新学习Vue中的按键监听和鼠标监听
javascript·vue.js·vue·计算机外设·click·up·down
TESmart碲视1 天前
HKS201-M24 大师版 8K60Hz USB 3.0 适用于 2 台 PC 1台显示器 无缝切换 KVM 切换器
单片机·嵌入式硬件·物联网·游戏·计算机外设·电脑·智能硬件
景行产品分享1 天前
2025年游戏鼠标推荐,游戏鼠标推荐,打CSGO(罗技、雷蛇、卓威、ROG、漫步者、赛睿、达尔优)
计算机外设
jubobolv3691 天前
[深度学习环境踩坑记录]ubuntu22.04安装RTX3060驱动,黑屏、桌面只有壁纸和鼠标,一顿折腾
计算机外设·持续部署
vfvfb2 天前
定时点击二次鼠标 定时点击鼠标
计算机外设·自动点击·定时点击鼠标·倒计时点击鼠标·定时点击
szekl3 天前
HDMI 2.0 4×2矩阵切换器412HN——多信号输入输出的高清解决方案
linux·矩阵·计算机外设·电脑·ekl
zfysis3 天前
键盘第一下无反应
计算机外设
Allen Bright13 天前
【JS-4.4-键盘常用事件】深入理解DOM键盘事件:提升用户交互体验的关键
javascript·计算机外设·交互
小天源14 天前
鼠标自动录制软件下载及使用
自动化测试·自动化·计算机外设·mouse recorder·鼠标录制·鼠标宏
小池先生14 天前
罗技键盘k380 fn按键问题 按f12不能直接打开调试,需要fn+f12
计算机外设