QML语法初见
锚定
- left 左
- right 右
- top 顶部
- bottom 底部
- centerIn 中央
- fill 填充满
- verticalCenter 垂直中央
- horizontalCenter 水平中央
anchors.left: parent //放在父对象左边
rotation 旋转(瞬间旋转)
onClicked: Wheel.rotation += 90 //点击时: Wheel对象旋转90度
动画(让旋转平滑进行)
Image{
id: root
Image {
id: wheel
Behavior on rotation { //每次旋转时的行为
NumberAnimation { //动画
duration: 250 //动画时间: 250ms
}
}
}
}
Qt构建模块(Qt building Blocks)
核心基础模块
| Qt Core | 核心的非图形类, 供其他模块使用 |
| Qt GUI | 图形用户界面(GUI)组件的基类, 包括OpenGL |
| Qt Multimedia | 音频, 视频, 电台, 摄像头的功能类 |
| Qt Network | 简化方便的网络编程类 |
| Qt QML | QML类与JavaScript语言的支持 |
| Qt Quick | 可高度动态创建的自定义应用程序用户界面框架 |
| Qt SQL | 集成SQL数据库类 |
| Qt Test | Qt应用程序与库的单元测试类 |
| Qt WebKit | 集成WebKit2的基础实现并提供了新的QML应用程序接口 |
| Qt WebKit Widgets | Widgets来自Qt4中集成WebKit1的窗口基础类 |
| Qt Widgets | 扩展Qt GUI模块的C++窗口类 |
- 组织架构如下图:
graph TD; QtNetwork-->QtCore; QtQuick-->QtQml; QtQml-->QtCore; QtSql-->QtCore; QtMultimedia-->QtGui; QtGui-->QtCore; linkStyle 0 stroke:#aaa,stroke-width:2px; linkStyle 1 stroke:#aaa,stroke-width:2px; linkStyle 2 stroke:#aaa,stroke-width:2px; linkStyle 3 stroke:#aaa,stroke-width:2px; linkStyle 4 stroke:#aaa,stroke-width:2px; linkStyle 5 stroke:#aaa,stroke-width:2px; style QtQuick fill:#f9f,stroke:#000,stroke-width:1px style QtQml fill:#f9f,stroke:#000,stroke-width:1px style QtNetwork fill:#f9f,stroke:#000,stroke-width:1px style QtSql fill:#f9f,stroke:#000,stroke-width:1px style QtGui fill:#f9f,stroke:#000,stroke-width:1px style QtCore fill:#f9f,stroke:#000,stroke-width:1px style QtMultimedia fill:#f9f,stroke:#000,stroke-width:1px
- Qt其他一些附加模块, 根据需要选择性了解, 列举如下:
- Qt 3D 提供3D编程接口
- Qt Bluetooth 多平台蓝牙接口
- Qt Contacts 访问联系人数据的接口
- Qt Location 提供定位, 地图, 导航, 位置搜索等接口
- Qt Organizer 提供组织事件(任务清单, 事件等)接口
- Qt Publish and SubScribe Qt发布与订阅
- Qt Service Framework 允许应用程序读取, 操纵和订阅来改变通知信息
- Qt System Info 发布系统相关的信息和功能
- Qt Versit 支持电子名片和日历数据格式
- Qt Wayland Linux Qt合成器应用程序接口(server), 和Wayland平台插件(clients)
- Qt Feedback 反馈
- Qt JSON DB 对于Qt的一个不使用SQL对象存储
创建Qt工程
新建Qt Quick项目
默认有如下几种模板
- Swipe
- 多个页面左右切换的框架, 下方标签式按钮可点击切换
- Scroll
- 下滑式item框架, 提供多个item下拉, 右侧有滚动条
- Stack
- 压栈式框架, 主页提供菜单, 可进入不同子页面, 子页面返回时, 返回到主页面.
- Empty
- 空项目, 只提供一个Helloworld窗口
第一个HelloWorld项目
- 这里我们选择上述框架中的Empty创建第一个HelloWorld界面程序