User Interfaces
Qt 具有多种创建用户界面的技术. 虽然可以根据需要混合和匹配这些不同的技术, 但一种方法通常比其他方法更适合某种类型的用户界面. Qt Creator 是一个将传统 Qt Widgets 与 Qt Quick 相结合使用的很好示例程序. 例如, Widget构成了用户界面的基础, 而 Qt Quick 用于实现欢迎模式. 以下部分简要介绍了用于创建用户界面的可用技术, 并提供了一个比较表来帮助选择最合适的技术.
Common Important UI Topics
QML Graphical User Interfaces
QML 允许开发人员以声明性方式构建用户界面. 用户界面特别受益于复合 QML 对象和使用属性绑定配置它们的简单性.
Qt Quick 是一个提供 QML 类型的模块, 用于创建用户界面, 例如具有自己的坐标系和渲染引擎的可视画布. 动画和过渡效果是 Qt Quick 中的一流概念, 并且可以通过粒子和着色器效果的专用组件来补充视觉效果.
Important UI Topics for QML Applications
- Visual types in QML
- Responding to User Input in QML
- Animations in QML
- Displaying Text in QML
- Layouts in QML
- Style and Theme Support
- Integrating JavaScript in QML
- Scalability
Graphical Controls
Qt Quick Controls 模块 (自 Qt 5.7 开始) 提供轻量级 QML 类型, 创建高性能用户界面. 这些控件通过采用简化的样式架构来提高效率.
有关如何使用 QML 创建应用程序用户界面的更多信息, 参见 QML User Interfaces.
Widget-based User Interfaces
Qt Widget 是传统的用户界面元素, 通常出现在桌面环境中. 这些 widget 与底层平台完美集成, 在 Windows、Linux 和 macOS 上提供原生外观. 这些 widget 非常成熟, 具有丰富的用户界面元素, 适合大多数静态用户界面. 与 Qt Quick 相比, 这些 widget 对于触摸屏和流畅, 高度动画的现代用户界面来说不能很好地扩展. 对于具有传统以桌面为中心的用户界面的应用程序(如办公类型应用程序), widget 是一个不错的选择.
Important Concepts in Qt Widgets
- Application Main Window
- Desktop Integration
- Dialog Windows
- Layout Management
- Model/View Programming
- Rich Text Processing
- Drag and Drop
- Internationalization
Visualizing Data
Qt 提供现成的 C++ 类和 QML 类型, 用于以图表和图形的形式可视化数据, 这被认为是分析数据的最佳方式. Qt Charts 和 Qt Data Visualization 是两个 Qt 插件, 它们使使用 2D 和 3D 模型的数据可视化成为现实.
Displaying Web Content
Qt 提供基于 Chromium 的 WebEngine 布局引擎, 使你能够将 Web 内容嵌入到 Qt 应用程序中. 该引擎可以集成到基于 Qt Widget 和基于 Qt Quick 的应用程序中.
有关 Qt 中对 Web 内容的支持的更多信息, 参见 Integrating Web Content.
Comparison
选择合适的技术构建用户界面并不总是那么容易. 它取决于几个变量, 例如项目中使用的其他技术或目标平台限制. 在某种程度上, 下表中的许多项目可以使用三种可用技术中的任何一种来实现. 下表旨在帮助你选择最适合该工作的工具.
Qt Quick / Qt Quick Controls | Qt Widgets | Qt WebEngine | Comments | |
---|---|---|---|---|
语言 | QML/JS | C++ | HTML/CSS/JS | |
原生的外观 | ![]() | ![]() | Qt Widget 和 Qt Quick Controls 1 与底层平台完美集成, 在 Windows, Linux 和 macOS 上提供原生外观. | |
自定义外观 | ![]() | ![]() | ![]() | Qt Widget 提供了通过样式表进行自定义的方法, 但对于不希望看起来原生的用户界面来说, Qt Quick 是一个性能更好的选择. |
流畅的动画 UI | ![]() | ![]() | Qt Widget 不能很好地缩放动画. Qt Quick 提供了一种方便, 自然的方式以声明方式实现动画. | |
触摸屏 | ![]() | ![]() | Qt Widget 通常需要鼠标光标才能实现良好的交互, 而 Qt Quick 仅提供在设计时考虑到触摸交互的原始构建块. WebView Qt Quick 组件支持多点触摸手势与 Web 内容交互. | |
标准的行业 widget | ![]() | Qt Widget 提供了构建标准行业类型应用程序所需的所有附加功能, 历经二十年的发展. Qt WebEngine Widget 提供了 widget 和附加类来呈现 Web 内容并与之交互. | ||
Model/View 编程 | ![]() | ![]() | Qt Quick 提供了方便的视图, 但 Qt Widget 提供了更方便和完整的框架. 除了 Qt Quick 视图之外, Qt Quick Controls 还提供 TableView. | |
快速的用户界面开发 | ![]() | ![]() | ![]() | Qt Quick 是快速 UI 原型设计和开发的绝佳选择. |
硬件图形加速 | ![]() | ![]() | ![]() | Qt Widget 提供 QGLWidget 用于渲染 OpenGL 图形, Qt WebEngine 支持 WebGL, 但事实证明, OpenGL ES 2.0 或基于 OpenGL 2.0 的 Qt Quick Scene Graph 可以为 UI 以及与 OpenGL 内容的集成提供最佳性能. |
图形效果 | ![]() | Qt Quick 中可用的粒子系统和着色器效果更加灵活. Qt Widget 在这方面提供的功能非常少。. | ||
富文本处理 | ![]() | ![]() | Qt Widget 目前为实现文本编辑器提供了最全面的基础. Qt 的富文本文档类也可以在 Qt Quick 和 Qt Quick Controls 的 TextArea 中使用, 但可能需要一些 C++ 实现. | |
现存的网页内容 | ![]() | Qt Quick 和 Qt Widget 都提供了用于呈现 简单富文本 的组件, 但 Qt WebEngine 是呈现成熟 Web 内容的最佳选择. |
国际化翻译
Qt 为将应用程序翻译成本地语言提供了出色的支持. 发布人员, 翻译人员和开发人员可以使用 Qt 翻译工具来完成他们的任务.
- Internationalization with Qt - 创建本地化应用程序的说明和过程
- Qt Linguist Manual - Qt翻译工具使用手册