博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
QML入门教程(一)
阅读量:5832 次
发布时间:2019-06-18

本文共 1340 字,大约阅读时间需要 4 分钟。

hot3.png

QML是什么?
QML是一种描述性的脚本语言,文件格式以.qml结尾。语法格式非常像CSS(参考后文具体例子),但又支持javacript形式的编程控制。 它结合了QtDesigner UI和QtScript的优点。QtDesigner可以设计出.ui界面文件,但是不支持和Qt原生C++代码的交互。QtScript可以和Qt原生代码进行交互,但是有一个缺点,如果要在脚本中创建一个继承于QObject的图形对象非常不方便,只能在Qt代码中创建图形对象,然后从QtScript中进行访问。而QML可以在脚本里创建图形对象,并且支持各种图形特效,以及状态机等,同时又能跟Qt写的C++代码进行方便的交互,使用起来非常方便。
如何使用? 在Qt C++文件中通过QDeclarativeView加载,就像使用UiLoader加载.ui文件一样。不过本文不会去介绍如何在Qt C++中使用QML,而是把重点放在QML的语法上,不过别担心看不到.qml文件的效果。Qt提供了一个工具QML Viewer可以查看.qml文件生成的效果,该程序在Qt的bin目录下,应用名字叫qml(Windows下叫qml.exe)。所以你在看到别人提供的.qml文件时,你可以用下面命令qml filename.qml 查看.qml的执行结果,咱们的第一个Hello,World生成界面如下
开始QML吧
上面的Hello,World源代码如下
1 import Qt 4.7
2
3 Rectangle {
4 id: page
5 width: 500; height: 200
6 color: “lightgray”
7
8 Text {
9 id: helloText
10 text: “Hello world!”
11 font.pointSize: 24; font.bold: true
12 y: 30; anchors.horizontalCenter: page.horizontalCenter
13 }
14 }
第1行是Qt QML的统一用法,指明当前QML会使用Qt-4.7里已经定义好的类型,比如第3行的Rectangle和第8行的Text。
第3行开始至文章结束处则定义了一个矩形的图形区域对象,第4行则申明了该矩形区域对象的id为”page”可以被其它对象识别并通过该id访问其成员属性,另外几个属性width/height/color则很好理解,语法跟CSS类似,可以写在一行中用分号”;”隔开。
第8行至第12行则是一个文本对象,看它代码的嵌套结构可以知道它是内嵌于Rectangle的。Text的属性除了anchors其它几个都能顾名思义。anchors描诉的是当前对象的位置和其它对象的相对关系,这里看到其水平中心位置在“page“的水平中心位置。如果想对anchors了解更多,请参考锚的解释。
以上就是Hello,World的全部代码,将其存为hellowordl.qml,那么只要执行qml hellowrold.qml就能看到文章前头的界面了。

转载于:https://my.oschina.net/birdlovecloud/blog/339316

你可能感兴趣的文章
选择排序
查看>>
SQL Server 数据库的数据和日志空间信息
查看>>
前端基础之JavaScript
查看>>
自己动手做个智能小车(6)
查看>>
自己遇到的,曾未知道的知识点
查看>>
P1382 楼房 set用法小结
查看>>
分类器性能度量
查看>>
windows 环境下切换 python2 与 pythone3 以及常用命令
查看>>
docker 基础
查看>>
解决灾难恢复后域共享目录SYSVOL与NELOGON共享丢失
查看>>
eclipse集成weblogic开发环境的搭建
查看>>
写一个bat文件,删除文件名符合特定规则,且更改日期在某
查看>>
我的友情链接
查看>>
写Use Case的一种方式,从oracle的tutorial抄来的
查看>>
【C#】protected 变量类型
查看>>
Ubuntu解压
查看>>
爬虫_房多多(设置随机数反爬)
查看>>
藏地密码
查看>>
爬虫去重(只是讲了去重的策略,没有具体讲实现过程,反正就是云里雾里)...
查看>>
react中将px转化为rem或者vw
查看>>