1.启动Ubuntu SDK，直接点击中间的“Create a new project”
2.在弹出的新建对话框中，选择左边的“Ubuntu”，里面有个“simple UI”
3.可以看到模板中自带的qml主文件
4.讲解代码
|
1 |
import Ubuntu.Components 0.1 |
这个是几乎所有的Ubuntu程序都必须添加的qml头文件，导入Ubuntu专门为qml制作的插件即可使用所有Ubuntu特色的UI组件
|
1
2
3
4
5
6 |
MainView { // objectName for functional testing purposes (autopilot-qt5) objectName: "mainView" // Note! applicationName needs to match the "name" field of the click manifest applicationName: "com.ubuntu.developer.qqworini.tutorial" |
MainView类型是Ubuntu程序的主窗口类型，类似于C中的main
|
1
2 |
idth: units.gu(100) height: units.gu(75) |
这里看到的是Ubuntu的一个特色数字，Ubuntu Touch立项之初就为了能运行在各种大大小小的设备上，所以采用了一种相对值以保证在分辨率不同的设备达到与设备匹配的大小，这个相对值会在程序运行时自动转换成与ppi成正比的像素值。
|
1
2 |
Page { title: i18n.tr("Simple") |
age类型是一种UI容器类型，作用类似QtQuick Control的page。i18n.tr（）函数用于多语言自动翻译，类似qt自带的qstr。
|
1
2
3
4
5
6 |
Column { spacing: units.gu(1) anchors { margins: units.gu(2) fill: parent } |
这个Column是标准的qml继承组件，包括别的qml基础组件，在Ubuntu程序里面都能100%兼容使用。开发者如果为了保证和别的平台的兼容性，也可以尽量使用qml基础组件而不影响程序的运行。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17 |
HelloComponent { id: label objectName: "label" text: i18n.tr("Hello..") } Button { objectName: "button" width: parent.width text: i18n.tr("Tap me!") onClicked: { label.text = i18n.tr("..world!") } } |
第一个HelloComponent是自定义组件，这个是qml的基础知识，不再作详细阐述。Button类型来自Ubuntu组件，用法与QtQuick Control的Button类似。
5.点击运行按钮，运行程序
6.是否发现，到现在一行代码都没有写
原文：http://www.cnblogs.com/Lance-Lan/p/3602527.html