QML 笔记 - Using Qt Quick Designer

自己的笔记，为了让自己加深印象和理解用的，几乎全部照抄过来。
原文链接：http://blog.csdn.net/cloud_castle/article/details/29382229

1.可以在Qt Quick Designer可视化编辑器或者代码编辑器中编辑.qml文件。
在工程中双击一个qml文件可以在代码编辑器总打开，然后选择设计模式就可以在可视化编辑器中打开他。
打开后大致分为3列。
第一列为导航面板（以树的形式显示当前QML文件中的各个项目）和库面板（显示用来构建应用程序的模块）
第二列（中间）为画布（工作区域）和状态面板（设置选定项目的属性，也可在代码中改变这些属性）
第三列（最右边）为属性面板。

2. Managing Item Hierarchy。
导航面板显示了当前QML文件中的各个项目以及他们的关系。
复制一个对象，它所有的子对象都将被复制。删除一个对象，它所有的子对象都将被删除。

3. Setting the stacking Order - 设置堆放层次
一个对象的 Z Property 决定了它与项目树中兄弟姐妹的层次关系。
默认情况下，拥有更高z值的对象将被绘制在其他对象的上方。
相同z值的，在列表后面的被绘制在上方。
改变z的方法：在画布上右键选择stack(Z)。

4. Switching Parent Items - 改变父对象。
当拖放一个QML类型的实例到画布上时，Qt Quick Designer会将该对象设置为当前位置下的那个实例的子对象。
想要改变其父对象，请在拖放该对象前按下shift键，在光标最下方的组件称为该项目的新的父对象。

5. QML Type Library
库面板使得你可以选择QML类型，UI组件，资源，以及管理你的import引入。
库面板以类别分组显示：自己的QML组件、基本类型、布局、位置了、类型、以及视图
Resources面板显示了与当前QML文件在同意目录下的文件

6. Specifying Item Properties -- 指定项目属性
Properties面板显示了当前项目的所有属性。这些属性由类型分组。所有类型上面部分的几个属性都是相同的，例如位置，尺寸，可见性等。
下半部分根据QML类型的不同而不同。

7. Viewing Changes in preproties -- 查看属性变化
属性的默认值显示白色，被改过的值以蓝色高亮显示。
在多个状态中被改变的属性也被蓝色高亮显示。

8.Marking Text Items for Translation
为了支持翻译器（translators），需要标记上每个项目应该被翻译的文本项目。
在属性面板中的Text中选择tr(1)。这样文本字符串将被封闭在qsTr函数调用中去。

9. Loading Placeholder Data -- 加载占位符数据
Qt Quick Designer支持视图、模型和委托，因此当你添加一个网格视图，列表视图，或路径视图项目时，ListModel和委托项目也将被自动添加。

10. using Dummy Models -- 使用虚拟模型
如果你在Qt Quick Designer中打开一个引用 了C++模型的文件，画布上将不会显示任何东西。如果模型中的数据是从因特网获取，你将完全无法控制它。为了获得可靠的数据，需要使用到下面的dummy data。

11. Building Transformation on Items  -- 创建项目的变换
Advanced面板允许你设置丰富的变换，例如旋转，缩放，平移。
你可以为一个对象分配一个任意的变换值，每种变化将一个接一个的按顺序进行。

12. adding Status  --  添加状态
12.1用户界面需要在不同的场景中呈现不同的界面构造，或者在用户交互时改变它的外表。通常这种清空下伴随一组同时进行的改变，这样的界面就可以被看做是从一个状态到另一个状态所发生的内部改变。
状态的改变可以屏蔽其内部的复杂性，因此通常被用作接口。
在QML中任何项目都可以在多个不同状态间进行切换以完成一组改变，这个改变需要通过修改有关项目的属性来实现。每个状态都提出一个不同配置，比如：
1）展示某些UI组件并隐藏另一些。
2）向用户展示不同的可用响应
3）开始、停止和暂停动画
4）在新的状态中执行某些需要执行的脚本
5）改变一个特定项目的属性值。
6）展示另一个视景。
12.2 state面板展示了组件的不同状态。点击其中的空格来添加状态，然后在编辑器中修改新的状态。不知道为啥我的状态面板后面没有加号。

13. Working with QML Types on Canvas：通过放置项目在画布上来设计你的应用程序

14. Snapping to Parent and Sibling Items -- 捕捉父对象和兄弟姐妹
当你进行设计时，可以使用捕捉（snapping）来对画布上的项目进行布局。就是画布左上角那几个按钮。

15. Hiding Item Boundaries -- 隐藏组件边界
画布左上角从左往右第4个按钮，用来显示隐藏边界

15. Selecting  Items -- 选择组件
当使用鼠标选择重叠的组件时，默认最上层的组件被选中。然而有些组件不含内容，比如MouseArea。他通常位于包含内容的组件的上层。要选中有内容的组件，可以用 画布左上角从左往右第5个按钮。

16. Previewing Component Size -- 预览组件尺寸
根对象的宽高度决定了组件的尺寸。你可以复用这个组件，类似与Buttons，在不同的设备配置、屏幕分辨率、屏幕方向上需要有不同的尺寸。但如果它最终大小由属性绑定决定，其尺寸可能变为0  (0, 0)。
为了试验不同组件尺寸，在画布的工具栏上输入Height和width的数值。其改变被应用到状态面板和画布上，但属性的值并未在QML中 被永久性改变。你可以在属性面板中永久性改变这个属性值。

17 specfying  Canvas  Size  -- 指定画布尺寸
改变画布尺寸 Tool->Options->Qt Quick->Qt Quick Designer 并在Canvas 组指定画布宽高

18. Refreshing the Canvas -- 刷新画布
QML文件与画布中的图像可能不会同步更新。就需要刷新了
按下R或者画布右上角那个x按钮。