02.qml基本元素

qml 基本元素

元素可分为可视化元素和非可视化元素

一、可视化元素

可视化元素如: Item(基础元素对象)、Rectangle(矩形框)、Text(文本)、Image(图像)、MouseArea(鼠标区域)

1. 基础元素对象：所有可视化元素的基础对象，所有其他的可视化元素都继承自Item。它自身不会有任何回执操作，但是定义了所有可视化元素共有的属性

2. 矩形框元素: Rectangle, 基本元素对象的一个扩展，增加了一个颜色来填充它，它还支持边界的定义，使用border.color, border.width
   注：一个矩形框如果没有width/height将不可见，如果互相关联的width/height的矩形框，在你组合逻辑中出现错误，可能就会发生矩形框不可见

3. 文本元素(Text)
   注：它的字符串类型的text属性，这个元素会使用给出的text和font来计算初始化的宽度和高度
   文本可以使用horizontalAlignment和verticalAlignment属性来设置对齐效果，style和styleColoer属性来配置文件的外框效果、浮雕效果和渲染效果
   一个没有设置宽度和高度的文本不可见

4. 图像元素：能够显示不同格式的图像

5. 鼠标区域元素：与不同元素的交互使用。这是一个矩形的非可视化元素对象，可以通过它来捕捉鼠标事件。这样输入处理与可视化显示分开

6. 组件：一个组件是一个可以重复使用的元素，有几种方式，其一就是一个文件一个组件，文件以元素类型开命名。只有根目录级的属性才能被其他文件的组件访问

7. 定位元素：Column元素将它的子对象通过顶部对齐的列方式进行排列，spacing属性用来设置每个元素之间的间隔大小
   Row元素将它的子对象从左到右或者从右到左依次排列，排列方式取决于layoutDirection属性
   Grid元素通过设置rows和columns属性将子元素排列在一个格栅中
   Flow元素通过flow属性和layoutDirection属性来控制流的方向
   Repeater重复元素model属性定义个数，index属性为索引值
   定位元素不影响子元素的大小

8. 布局元素：anchors是基础元素的基本属性

9. 输入元素：TextInput文本输入元素允许用户输入一行文本，KeyNavigation附加属性可以预先设置一个元素id绑定切换焦点的按键

10. 焦点区域： FocusScope一个焦点区域定义了如果焦点区域接受到焦点，它的最后一个使用focus:true的子元素接受焦点，它就将会把焦点传递给最后一个元素

11. 文本编辑：TextEdit元素与文本输入类似，支持多行

12. 按键元素： Key，附加属性key允许极域某个按键的点击来执行代码

二、动态元素

所有在QtQuick中的动画都由同一个计时器来控制，因此他们始终都保持同步，这也提高了动画的性能和显示效果

1. PropertyAnimation: 属性动画，使用属性值改变播放的动画

2. NumberAnimation: 数字动画， 使用数字改变播放的动画

3. ColorAnimation : 颜色动画， 使用颜色改变播放的动画

4. RotationAnimation: 旋转动画， 使用旋转改变播放的动画

5. PauseAnimation: 停止动画， 运行暂停一个动画

6. SequentialAnimation: 顺序动画，允许动画有序播放

7. ParallelAnimation: 并行动画， 允许动画同时播放

8. AnchorAnimation: 瞄定动画， 使用瞄定改变播放的动画

9. ParentAnimation：父元素动画， 使用父对象改变播放的动画

10. SmotthedAnimation: 平滑动画， 跟踪一个平滑值播放的动画

11. SpringAnimation:弹簧动画， 跟踪一个弹簧变换的值播放的动画

12. PathAnimation: 路径动画， 跟踪一个元素对象的路径的动画

13. Vector3dAnimation: 3D容器动画， 使用QVector3d值改变播放的动画

14. PropertyAction: 属性动作， 在播放动画时改变属性

15. ScripAction: 脚本动作， 在播放动画时运行脚本