-
如上图,新建一个空的Qt Quick Application,运行就是一个空的窗口文件
-
import语句
导入模块,类似于c++中的include
QtQuick 2.9:此模块为创建图形用户界面提供了最基本的类型
QtQuick.Window模块:window类型可以为Qt Quick场景创建一个顶级窗口 -
QML对象
对象类型被实例化以后,就叫做该对象类型的对象
如Window,在代码中现在就是一个对象,以大写字母开头,后面跟一对大括号,在括号中包含对象的属性 -
QML元素
如以下的控件 -
Item: 基本的项元素 在QML中所有可视化的向都继承他,是所有可视元素的基类
它本身不可见,但是我们可以使用Item来分组其他的可视图元,它定义了绘制图元所需要的大部分的通用属性 -
Rectangle: 绘制一个填充矩形,可以带边框,也可以不带,还可以填充颜色
-
Text: 可以显示纯文本或者富文本,它有非常多的属性
id并不是一个属性,设置id的作用是为了在其他的对象中来获取text属性的值。所以一般需要在开头设置一个id,id值是唯一的,而且必须使用小写字母或者下划线开头,不能使用其他字符
-
Qt Quick Controls 与 Qt Quick Controls 2的区别
直接在代码中同时调用两个模块会出错,因为qml文件只能识别到一个版本的控件。
qt里面没有安装QtQuick.Controls 2,一般如果是通过sudo apt-get install 方式安装qt的都会遇到这个问题,在终端中输入sudo apt-get install qml-module-qtquick-controls2安装即可 -
最终代码如下
import QtQuick 2.9
import QtQuick.Window 2.2
Window {
visible: true
width: 640
height: 480
title: qsTr("Hello World")
Rectangle{
width: 300
height: 200
anchors.centerIn: parent //定义了矩形基于window对象居中
color: "blue"
border.width: 2
border.color: "black"
radius: 3 //定义了矩形的四周的圆滑角度,数值越大越平滑
}
Text {
id: text1
text: qsTr("Hello World!") //设置显示的文字
anchors.centerIn: parent
font.pixelSize: 30 //字体大小
font.bold: true //文字是否加粗,默认false
font.italic: true //文字是否倾斜,默认false
font.capitalization: Font.AllUppercase //文字大小写
font.family: "Corber" //文字样式
color: "red" //文字颜色
}
}