qml学习.pdfVIP

前言:Qt Declarative UI 传得沸沸扬扬，却很少有中文资料介绍这是一个什么样的技术，以及如何使用它。偶尔能搜到几篇 也是掐头去尾的，让人摸不着头脑。CuteQt 网友英狐奉献的三篇文章很有参考价值，把我带入了门。我准备翻译的这个入门 教程来自于Qt 官方文档 ，更多的是语法性的介绍。说是翻译，其实是我在原文基础上的一个阅读理解吧。 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 就能看到文章前头的界 面了。 更多对象？ 在上面的代码中我们用到了Rectangle 和Text ，那么我还有哪些对象以及这些对象有哪些属性呢。那么请访问QML-Item 类,Item 类是QML 最基础的类，通过查看它的继承类以及这些继承类可用的属性，你可以添加更多你感兴趣的内容。 好吧, Happy QML。 手头的事情勉强告一段落，看到QT4.7 的技术预览版中已经包含了 declarative UI ，心中 ，要知道如果当初不是WPF 太 臃肿及不能跨平台，我们的项目已经在WPF+WCF 的路上走的很远了（可以自豪的说，WPF+WCF 的应用，无论国内还是国 外，俺们项目组也算是走在前列的 *_* ）。。。。 唔，远了，扯回来。先下了qt creator 2.0 ，装上，用2010.02 的