QML (Qt Markup Language[3] 或 Qt Meta Language 或 Qt Modeling Language[4]) 是基于JavaScript宣告式编程编程语言,用于设计图形用户界面为主的应用程式。它是Qt Quick英语Qt Quick诺基亚开发的用户界面建立包的一部分。QML 主要用于移动应用程序,注重于触控输入、流畅的动画(60张/秒)和用户体验。QML documents 描述元素的物件树。

Quick Facts 编程范型, 实现者 ...
QML
编程范型编程范型宣告式编程脚本语言
实现者Qt发展框架
发行时间2009
当前版本
编辑维基数据链接
类型系统动态强类型
网站[1]
启发语言
JavaScriptQt
影响语言
Qt
Close
Quick Facts 扩展名, 互联网媒体类型 ...
QML
扩展名
.qml
互联网媒体类型text/x-qml
开发者Qt Project
格式类型脚本语言
网站qt-project.org/doc/qt-5/qmlapplications.html
Close

QML 元素可以透过标准 JavaScript 增强,包括这 inline 和引入.js 档。元素可以也无缝集成和使用 Qt 框架的 C++ 组件扩展。

语言的名称是 QML。runtime的名称是 QQuickView。

语法、语义

基本语法

示例:

import QtQuick 1.0

 Rectangle {
     id: canvas
     width: 200
     height: 200
     color: "blue"

     Image {
         id: logo
         source: "pics/logo.png"
         anchors.centerIn: parent
         x: canvas.height / 5      
     }
 }

动画

 Rectangle {
     id: rect
     width: 120; height: 200

     Image {
         id: img
         source: "pics/qt.png"
         x: 60 - img.width/2
         y: 0

         SequentialAnimation on y {
             loops: Animation.Infinite
             NumberAnimation { to: 200 - img.height; easing.type: Easing.OutBounce; duration: 2000 }
             PauseAnimation { duration: 1000 }
             NumberAnimation { to: 0; easing.type: Easing.OutQuad; duration: 1000 }
         }
     }
 }

Qt/C++ 集成

QML 不需要 Qt/C++ 的知识就能使用,但它可以轻松地扩展 Qt。

熟悉的概念

QML 提供直接访问,从以下来自 Qt 的概念:

  • QAction – action 类型
  • QObject signals and slots – 作为在 JavaScript 中调用的函数
  • QObject properties – 作为 JavaScript 中的变量
  • QWidget – QDeclarativeView 是一个 QML-displaying widget
  • Q*Model – 直接用在资料绑定 (如 QAbstractItemModel)

Qt 信号处理式

 MouseArea {
     onPressed: console.log("mouse button pressed")
 }

操作方法

开发工具

由于 QML 和 Javascript 的语法相似,大多数支持 Javascript 的编辑器均可编辑 QML。但是从 Qt Creator 的 2.1 版本开始,该 IDE 提供了完整的语法高亮、代码补全、内建帮助和所见即所得编辑器。在商业版本的 Creator 中,所见即所得编辑器还会提供更多的功能。

参考资料

外部链接

Wikiwand in your browser!

Seamless Wikipedia browsing. On steroids.

Every time you click a link to Wikipedia, Wiktionary or Wikiquote in your browser's search results, it will show the modern Wikiwand interface.

Wikiwand extension is a five stars, simple, with minimum permission required to keep your browsing private, safe and transparent.