目录
注意:使用VS2022开发QML的时候既是写错了属性VS是不会报错的,但是软件就是运行不起来.所以使用vs开发qml一定注意qml的属性一定要检查是否正确.
创建QML,我使用的环境是win10系统,VS2022+Qt6.2学习QML.
环境搭建不说了,其实很好搭建网上有很多关于搭建的方法.
创建一个demo:
打开VS2022
选择自己的存储路径已经项目名称:
接下来配置Qt
选择编译环境:
我这里选择vs2019 debug版的
运行一下:
基本的已经创建完成了.
接下来学习QML中的知识了.之前看过一点,个人个人觉得跟WPF比较类似.感觉比较亲切.不知道以后好不好学.
QML知识:
import QtQuick 2.9
import QtQuick.Window 2.2
Window {
visible: true
width: 640
height: 480
title: qsTr("Hello World")
}
这个就是QML创建时候的默认代码
代码中的这个Window就是运行后的窗口,其中有几个属性.
第一个属性就是是否可见属性, visible 如果设置为true即为可见,false既是代码在运行也不会出现窗口.
height和width是设置窗口的高度和宽度的.
title属性是设置窗口的标题的.
import QtQuick 2.9
import QtQuick.Window 2.2
Window {//root 控件,相当于主界面
visible: true
width: 640
height: 480
x:50
y:60 //相对于父控件
title: qsTr("My QML")
}
代码段中的x和y属性是设置软件从哪里显示的.现在软件是从(50,60)这个坐标开始显示.相对于window这个控件,window就是显示器坐标.
要是其他空间的x和y就是相对于其他控件的位置.
显示器坐标是以左上角为原点,大概是这样的.
限制窗口大小
minimumWidth: 400
minimumHeight: 300
maximumWidth: 800
maximumHeight: 500
注意:使用VS2022开发QML的时候既是写错了属性VS是不会报错的,但是软件就是运行不起来.所以使用vs开发qml一定注意qml的属性一定要检查是否正确.
color:"#FF00FF"
opacity:0.5
color是设置窗体的颜色的
opacity是设置窗体透明度的
在QML中定义信号槽:
在qml中自定义信号:signal mySig()
这就是一个信号,mySig就是一个信号;
槽函数:
onMySig:{
}
其中前面的on和M一定要大写.
import QtQuick 2.9
import QtQuick.Window 2.2
Window {
visible: true
width: 600
height: 400
minimumWidth: 400
minimumHeight: 300
maximumWidth: 800
maximumHeight: 500
color:"#FF00FF"
opacity:0.5
title: qsTr("My QML")
signal mySig()
onMySig:{
}
}
Button{
id:btn1
width:50
height:50
focus:true
objectName:"btn1"
background:Rectangle{
border.color:btn1.focus?"blue":"black"
}
onClicked:{
console.log("btn1 clicked")
}
Keys.onRightPressed:{
btn2.foucs = true
}
}
Button{
id:btn2
width:50
height:50
x: 100
objectName:"btn2"
background:Rectangle{
border.color:btn2.focus?"blue":"black"
}
onClicked:{
console.log("btn2 clicked")
}
Keys.onLeftPressed:{
btn1.foucs = true
}
}
这是添加button空间:import QtQuick.Controls 2.3需要添加
onClicked:{
console.log("btn1 clicked")
}
这个就是系统槽函数.