Qt Quick 控件样式#

可用样式#

Qt Quick 控件自带了多种样式。

基本样式#

../_images/qtquickcontrols-basic.png

基本样式 是一种简单轻量级样式,它提供了适用于 Qt Quick 控件的最大性能。

Fusion 风格#

../_images/qtquickcontrols-fusion-light.png

Fusion 风格的浅色主题。

../_images/qtquickcontrols-fusion-dark.png

Fusion 风格的深色主题。

Fusion 风格 是一种与平台无关的样式,为 Qt Quick 控件提供了以桌面为导向的视觉和触觉。

Imagine 风格#

../_images/qtquickcontrols-imagine.png

Imagine 风格 基于图像资产。该样式包含一组默认图像,可以通过使用预定义的命名约定提供图像目录轻松更改。

macOS 风格#

../_images/qtquickcontrols-macos-light.png

macOS 风格的浅色主题。

../_images/qtquickcontrols-macos-dark.png

macOS 风格的深色主题。

macOS 风格 是为 macOS 提供原生外观的样式。

注意

此样式仅适用于在 macOS 上运行的应用程序。

iOS 风格#

../_images/qtquickcontrols-ios-light.png

iOS 风格的浅色主题。

../_images/qtquickcontrols-ios-dark.png

iOS 风格的深色主题。

iOS 风格 是基于图像资产为 iOS 设计的样式。

注意

此样式仅适用于在 iOS 上运行的应用程序。

Material 风格#

../_images/qtquickcontrols-material-light.png

Material 风格的浅色主题。

../_images/qtquickcontrols-material-dark.png

Material 风格的深色主题。

Material 风格 基于谷歌 Material 设计指南提供了一种吸引人的设计,但比基本样式需要更多的系统资源。

Universal 风格#

../_images/qtquickcontrols-universal-light.png

Universal 风格的浅色主题。

../_images/qtquickcontrols-universal-dark.png

Universal 风格的深色主题。

Universal 风格 基于微软通用设计指南提供了一种吸引人的设计,但比基本样式需要更多的系统资源。

Windows 风格#

../_images/qtquickcontrols-windows.png

Windows 风格 是为 Windows 提供原生外观的样式。

注意

此样式仅适用于在 Windows 上运行的应用程序。

在 Qt Quick 控件中使用样式#

默认样式#

如果没有显式设置样式,将使用默认样式。使用的样式取决于操作系统

对于所有其他操作系统,使用的是基本风格

编译时风格选择#

编译时风格选择是通过在 QML 中导入它来指定要使用某种风格的方法。例如,要导入 Material 风格

请注意,QtQuick.Controls(负责运行时风格选择)没有被导入。备用风格由风格的 qmldir 指定。

module QtQuick.Controls.Material
# ...
import QtQuick.Controls.Basic auto

编译时风格选择的好处是 QML 编译器知道正在使用哪种特定的风格,并可以为绑定生成 C++ 代码。

另一个好处是无需使用 QtQuick.Controls 插件,因此无需与应用程序一起部署。

如果您的应用程序是以静态方式构建的,则需要显式导入。

编译时风格选择的缺点是单个可执行文件不能支持多种风格,因为每种风格都需要自己的。

运行时风格选择#

运行时风格选择是通过导入 QtQuick.Controls 来指定要使用的风格的方法。

QtQuick.Controls 插件将导入运行时通过以下一种或多种方法设置的样式和备用样式

  • setStyle()

  • 命令行参数 -style

  • 环境变量 QT_QUICK_CONTROLS_STYLE

  • 配置文件 qtquickcontrols2.conf

这些方法的优先级按照列表顺序从高到低。也就是说,使用 QQuickStyle 设置样式将始终优先于使用命令行参数,例如。

运行时风格选择的好处是单个应用程序二进制文件可以支持多种风格,这意味着最终用户可以选择使用哪种风格来运行应用程序。

这种方法的缺点是 QML 编译器无法知道正在使用哪种特定的风格,因此不能为 Qt Quick Controls 类型的属性生成 C++ 绑定代码。这不会影响 QML 编译器生成来自其他模块的类型绑定的 C++ 代码的能力。

在 C++ 中使用 QQuickStyle#

QQuickStyle 提供了配置特定风格的 C++ API。下面的示例演示了如何使用 Material 风格运行 Qt Quick Controls 应用程序

QQuickStyle::setStyle("Material");

有关 QQuickStyle 的更详细描述,请参阅。

命令行参数#

通过传递 -style 命令行参数是测试不同风格的便捷方式。它优先于列出的其他方法。下面的示例演示了如何使用 Material 风格运行 Qt Quick Controls 应用程序

./app -style material

环境变量#

设置环境变量 QT_QUICK_CONTROLS_STYLE 用于设置系统范围内的样式首选项。它优先级高于以下提到的配置文件。以下示例运行一个使用通用样式的 Qt Quick Controls 应用程序。

QT_QUICK_CONTROLS_STYLE=universal ./app

请参阅 Qt Quick Controls 支持的环境变量 了解支持的环境变量完整列表。

配置文件#

Qt Quick Controls 支持一个特殊配置文件,即 :/qtquickcontrols2.conf,它集成到应用程序资源中。

该配置文件可以指定首选样式(可能被之前描述的任一方法覆盖)以及某些特定样式属性。以下示例指定首选样式为 Material 样式。

[Controls]
Style=Material

请参阅 Qt Quick Controls 配置文件 了解有关配置文件的更多详细信息。