Qt Quick 示例和教程

使用QML构建用户界面

Qt 包含多个示例来演示特定用法。这些示例可以作为应用程序运行,也可以在 Qt Creator 中作为非 GUI 示例运行。Qt 教程展示了逐步的信息,并提供了对特定代码片段的深入理解。

本页面列出了Qt Qml和Qt Quick的示例,然而,许多其他Qt模块也包含与其QML API相关的示例。

运行示例和演示

示例随Qt安装程序打包,并通过Qt Creator访问。有关在Qt Creator中运行示例的更多信息,请访问构建和运行示例页面。

在Qt Creator的欢迎模式下打开并运行示例。大多数示例可以在各种平台上运行,要搜索特定平台的示例,请在搜索字段中输入平台名称(或任何关键字)。例如,在搜索字段中输入mobile会列出与移动平台完全兼容的示例。

要查看其他示例和教程,请访问Qt示例和教程页面。

Qt Quick 演示

这里列出了一些功能齐全的演示应用程序。它们是完整的应用程序,展示了如何构建和结构化可部署的Qt应用程序。许多演示可以部署到移动和桌面平台。

开发Qt Quick应用程序

以下页面展示了如何使用Qt Creator和Qt Quick开发Qt应用程序。这些页面演示了各种步骤,如用例和介绍材料。有关Qt Quick应用程序及相关模块的更多信息,请访问QML应用程序页面。

开发环境

  • 创建Qt Quick项目

  • 使用带有插件的QML模块

开始使用QML和Qt Quick

  • QML 入门

  • 警报应用程序

  • Qt Design Studio 教程

  • SameGame

使用案例

  • QML中的视觉类型

  • 在QML中响应用户输入

  • QML中的动画

  • 在QML中显示文本

  • QML中的布局

  • 样式和主题支持

  • 在QML中集成JavaScript

扩展QML

以下教程展示了如何使用Qt Qml模块将基于QML的应用程序与C++代码结合和扩展。

  • 使用C++编写QML扩展

  • 使用C++编写高级QML扩展

示例

示例是一些小型应用程序,展示了如何实现各种Qt Quick功能。这些示例可以在各种平台上运行,并从Qt Creator中打开。

QML 类型和控件

  • 控件库

  • 表格视图

  • 文本和字体

  • Qt Quick Controls - 目录

布局和视图

  • Qt Quick 布局 - 基础示例

  • Qt Quick 布局 - 响应式布局示例

  • 定位器

  • 视图

  • 窗口和屏幕

图像与图形

  • 图像元素

  • 动画

  • Canvas API

  • 着色器效果

  • 多重效果

  • 基于MultiEffect的项目过渡

形状

  • 形状

  • 天气预报

键盘、焦点和触摸

  • 关键交互

  • 指针处理器

系统和事件

  • 可访问性

  • 拖放

  • 项目变量刷新率

场景图

  • 自定义材料

  • 便携式基于QRhi的3D渲染作为场景底层

  • 在QQuickItem中显示QRhi渲染的图像

  • 实现基于QRhi的QSGRenderNode

  • 将Qt Quick渲染重定向到QRhiTexture

  • 纹理提供者和材质

  • 自定义几何

  • 图表

使用原生3D API扩展场景图

  • 基于Vulkan的3D渲染作为场景底层

  • 实现一个自定义的QQuickItem,用于显示本地的Vulkan图像

  • 基于金属的3D渲染作为场景底层

  • 实现一个自定义的QQuickItem,用于显示本地的Metal纹理

  • 基于Direct3D 11的渲染作为场景底层

  • 基于OpenGL的渲染作为场景底层

  • 将Qt Quick渲染重定向到OpenGL纹理

  • 将Qt Quick渲染重定向到Direct 3D纹理

在QWidget应用程序中添加Qt Quick场景

  • 使用 QQuickWidget

  • QQuickWidget - QQuickView 比较 (OpenGL)

  • 将QQuickView嵌入为本地窗口

适用于Android的Qt Quick

  • 适用于Android Studio项目的Qt Quick

  • 将QtAbstractListModel暴露给QML

  • 在Android Studio项目中使用QtAbstractItemModel