QML入门教程

QML是Qt推出的Qt Quick技术的一部分,是一种新增的简便易学的语言。QML是一种陈述性语言,用来描述一个程序的用户界面:无论是什么样子,以及它如何表现。在QML,一个用户界面被指定为具有属性的对象树。 这使得Qt更加便于很少或没有编程经验的人使用。
QML实际上是Qt Quick (Qt4.7.0中的新特性)核心组件之一:Qt Quick是一组旨在帮助开发者创建在移动电话,媒体播放器,机顶盒和其他便携设备上使用越来越多的直观、现代、流畅UI的工具集合。
QML可以在脚本里创建图形对象,并且支持各种图形特效,以及状态机等,同时又能跟Qt写的C++代码进行方便的交互,使用起来非常方便。
QML模块为用QML语言开发应用程序和库提供了一个框架,它定义、实现语言和引擎,并提供了让开发者使用自定义类型、JavaScript与C++整合的QML代码来扩展QML语言的API,QML模块提供了QML API和C++ API。
    Qt的QML模块提供QML应用程序的语言和基础,Qt Quick模块提供了许多可视化组件,支持模型-视图,动画框架,多用于构建用户界面。
 
包括模块类的定义,可以使用以下语句:
#include
 
在QML中可通过导入QtQML让QML类型可用,可以使用以下语句:
import QtQml 2.0
 
要链接模块,可以使用以下语句(添加至qmake .pro中):
QT += qml
 
简单的介绍就到这里,如果要了解更多,请参考专业的Qt Assistant。。。
 
举例:
.qml内容文件如下:
 
import QtQuick 2.0
import QtQuick.Window 2.1
 
Window {
    width: 400
    height: 200
    color: "green"
 
    Column {
        anchors.centerIn: parent
        spacing: 10
 
        Text {
            text: "Hello World"
            font.family: "Helvetica"
    font.pointSize: 20
            color: "white"
}
 
Text {
    color: Qt.rgba(0, 0, 255, 100)
    font.pointSize: 16
    text: Qt.md5("hello, world")
        }
    }
}
 
Window:窗体
Text:既可以显示普通文本和富的文本项。例如,可以定义特定字体、大小、颜色的文本。
Column :子项按列显示
width、height、color、text等就不过多说明了,分别代表:宽、高、颜色、文本。  
anchors.centerIn: parent表示位于窗体*
spacing: 10表示各个子项的间距为10
Qt.md5("hello, world")使用md5对"hello,world"加密
 
运行:
  • 方式一:右键.qml文件->打开方式(选择qml.exe或qmlviewer.exe)即可。
  • 方式二:使用QQuickView模块。
在main方法中添加以下代码:
QQmlEngine *engine = new QQmlEngine();
QQmlComponent *component = new QQmlComponent(engine);
component->loadUrl(QUrl("qrc:/qml/HelloWorld.qml")); //QUrl::fromLocalFile("HelloWorld.qml")
if(!component->isReady())
{
        qWarning("%s", qPrintable(component->errorString()));
 
        return -1;
}
QObject *object = component->create();
QQuickWindow *window = (qobject_cast)(object);
window->show();
上一篇:6.Python3标准库--数学运算


下一篇:cobar和tddl分享