QML是一种被设计用来描绘用户的程序界面的声明式语言:例如它让界面看起来像什么,它如何运作。在QML中,一个用户界面实际上就是一组树形的指定了特定树形的对象。在这个教程里面,我们将会为你展示如何使用PySide和QML创建一个简单的Hello World应用。
一个PySide/QML应用有至少两个不同的文件构成——一个描述用户界面的QML文件,和一个用来指明在哪载入qml文件python文件。现在为了避免出现问题,不要忘记将所有文件都保存到同一文件夹下。
这里是一个名为view.qml简易的QML文件:
import QtQuick 1.0
Rectangle {
width: 200
height: 200
color: "red"
Text {
text: "Hello World"
anchors.centerIn: parent
}
}
我们通过导入QtQuick 1.0开始,理论上讲,QtQuick有一个不同与Qt/PySide的发行时间表。
剩余的QML代码对于那些使用过HTML或XML文件的人来说相当简单。我们创建了一个红色的尺寸为200*200的矩形,在矩形的内部,我们添加了一个文本元素并显示Hello World。代码anchors.centerIn: parent 会使文本出现在它关系最近的父对象的中间。
现在,让我看看在PySide里面如何编写python代码。让我们叫它main.py:
#!/usr/bin/env python
# -'''- coding: utf-8 -'''-
import sys
from PySide.QtCore import *
from PySide.QtGui import *
from PySide.QtDeclarative import QDeclarativeView
# Create Qt application and the QDeclarative view
app = QApplication(sys.argv)
view = QDeclarativeView()
# Create an URL to the QML file
url = QUrl('view.qml')
# Set the QML file and show
view.setSource(url)
view.show()
# Enter Qt main loop
sys.exit(app.exec_())
如果你之前跟随我们的教程已经熟悉了PySide,那么这些代码也应该很熟悉了。这里只有一个新技巧,你需要导入QDeclarativeView并设置QML文件的URL的路径来源QDeclarativeView object。然后,如同其他任何一个Qt widget,你可以调用QDeclarativeView.show()显示它们。
提示:如果你是在编写桌面程序,你可能需要在显示视图前添加view.setResizeMode(QDeclarativeView.SizeRootObjectToView)。这会使得QML的矩形会跟随窗口调整尺寸。