Spec-Zone.ru › Qt 6.1

Универсальный стиль

Универсальный стиль основан на рекомендациях по универсальному дизайну Microsoft. Подробнее...

Заявление импорта: import QtQuick.Controls.Universal 2.12
С момента: Qt 5.7

Присоединённые свойства

  • акцент : цвет
  • фон : цвет
  • передний план : цвет
  • тема : перечисление

Присоединённые методы

  • цвет цвет(предварительно определённое перечисление)

Подробное описание

Универсальный стиль — это стиль, не зависящий от устройства, основанный на Рекомендациях Microsoft по универсальному дизайну. Универсальный стиль разработан для правильного отображения на всех устройствах, от телефонов и планшетов до ПК.

Универсальный стиль в светлой теме

Универсальный стиль в тёмной теме

Чтобы запустить приложение с универсальным стилем, см. Использование стилей в Qt Quick Controls.

Примечание: Универсальный стиль не является родным стилем Windows 10. Универсальный стиль — это 100% кроссплатформенная реализация стиля Qt Quick Controls, которая соответствует рекомендациям Microsoft по универсальному дизайну. Стиль работает на любой платформе и выглядит более или менее одинаково везде. Незначительные различия могут возникнуть из-за различий в доступных системных шрифтах и двигателях рендеринга шрифтов.

Настройка

Универсальный стиль позволяет настраивать четыре атрибута: тему, акцент, передний план и фон.

Оба атрибута можно указать для любого окна или элемента, и они автоматически распространяются на дочерние элементы таким же образом, как и шрифты. В следующем примере окно и все три радиокнопки отображаются в тёмной теме с фиолетовым цветом акцента:

import QtQuick 2.12
import QtQuick.Controls 2.12
import QtQuick.Controls.Universal 2.12

ApplicationWindow {
    visible: true

    Universal.theme: Universal.Dark
    Universal.accent: Universal.Violet

    Column {
        anchors.centerIn: parent

        RadioButton { text: qsTr("Small") }
        RadioButton { text: qsTr("Medium");  checked: true }
        RadioButton { text: qsTr("Large") }
    }
}

Помимо указания атрибутов в QML, их также можно указать через переменные среды или в файле конфигурации. Атрибуты, указанные в QML, имеют приоритет над всеми другими методами.

Файл конфигурации

Переменная Описание
Theme Указывает значение по умолчанию для универсальной темы. Значение может быть одним из доступных тем, например "Dark".
Accent Указывает значение по умолчанию для универсального цвета акцента. Значение может быть любым цветом, но рекомендуется использовать один из предварительно определённых универсальных цветов, например "Violet".
Foreground Указывает значение по умолчанию для универсального цвета переднего плана. Значение может быть любым цветом или одним из предварительно определённых универсальных цветов, например "Brown".
Background Указывает значение по умолчанию для универсального цвета фона. Значение может быть любым цветом или одним из предварительно определённых универсальных цветов, например "Steel".

Дополнительные сведения о файле конфигурации см. в Файл конфигурации Qt Quick Controls.

Переменные среды

Переменная Описание
QT_QUICK_CONTROLS_UNIVERSAL_THEME Указывает значение по умолчанию для универсальной темы. Значение может быть одним из доступных тем, например "Dark".
QT_QUICK_CONTROLS_UNIVERSAL_ACCENT Указывает значение по умолчанию для универсального цвета акцента. Значение может быть любым цветом, но рекомендуется использовать один из предварительно определённых универсальных цветов, например "Violet".
QT_QUICK_CONTROLS_UNIVERSAL_FOREGROUND Указывает значение по умолчанию для универсального цвета переднего плана. Значение может быть любым цветом или одним из предварительно определённых универсальных цветов, например "Brown".
QT_QUICK_CONTROLS_UNIVERSAL_BACKGROUND Указывает значение по умолчанию для универсального цвета фона. Значение может быть любым цветом или одним из предварительно определённых универсальных цветов, например "Steel".

Полный список поддерживаемых переменных среды см. в Поддерживаемые переменные среды в Qt Quick Controls.

Зависимость

Для доступа к атрибутам, специфичным для универсального стиля, необходимо отдельно импортировать универсальный стиль. Следует отметить, что независимо от ссылок на универсальный стиль, тот же код приложения работает с любым другим стилем. Атрибуты, специфичные для универсального стиля, имеют эффект только при запуске приложения с универсальным стилем.

Если универсальный стиль импортирован в файл QML, который всегда загружается, универсальный стиль должен быть развернут вместе с приложением, чтобы приложение можно было запустить независимо от того, с каким стилем запущено приложение. Используя выбор файлов, можно применять настройки, специфичные для стиля, без создания жёсткой зависимости от стиля.

Предварительно определённые универсальные цвета

Доступные предварительно определённые цвета:

Константа Описание
Universal.Lime #A4C400
Universal.Green #60A917
Universal.Emerald #008A00
Universal.Teal #00ABA9
Universal.Cyan #1BA1E2
Universal.Cobalt #3E65FF (цвет акцента по умолчанию)
Universal.Indigo #6A00FF
Universal.Violet #AA00FF
Universal.Pink #F472D0
Universal.Magenta #D80073
Universal.Crimson #A20025
Universal.Red #E51400
Universal.Orange #FA6800
Universal.Amber #F0A30A
Universal.Yellow #E3C800
Universal.Brown #825A2C
Universal.Olive #6D8764
Universal.Steel #647687
Universal.Mauve #76608A
Universal.Taupe #87794E

См. также Основной стиль, Материал стиль

Документация по присоединённому свойству

Universal.акцент : цвет

Это присоединённое свойство содержит цвет акцента темы. Свойство может быть присоединёно к любому окну или элементу. Значение распространяется на дочерние элементы.

Значение по умолчанию — Universal.Cobalt.

В следующем примере цвет акцента выделенной кнопки изменён на Universal.Orange:

Button {
    text: qsTr("Button")
    highlighted: true
    Universal.accent: Universal.Orange
}

Примечание: Хотя акцент может быть любым цветом, рекомендуется использовать один из предварительно определённых универсальных цветов, которые разработаны для совместного использования с остальной частью палитры универсального стиля.

Universal.фон : цвет

Это присоединённое свойство содержит цвет фона темы. Свойство может быть присоединёно к любому окну или элементу. Значение распространяется на дочерние элементы.

Значение по умолчанию зависит от темы (светлая или тёмная).

В следующем примере цвет фона панели изменяется на Universal.Steel:

Pane {
    Universal.background: Universal.Steel

    Button {
        text: qsTr("Button")
    }
}

Universal.foreground : цвет

Это присоединённое свойство содержит цвет переднего плана темы. Свойство может быть присоединённо к любому окну или элементу. Значение передаётся потомкам.

Значение по умолчанию зависит от темы (светлая или тёмная).

В следующем примере цвет переднего плана кнопки задаётся как Universal.Pink:

Button {
    text: qsTr("Button")
    Universal.foreground: Universal.Pink
}

Universal.theme : перечисление

Это присоединённое свойство указывает, является ли тема светлой или тёмной. Свойство может быть присоединённо к любому окну или элементу. Значение передаётся потомкам.

Доступные темы:

Постоянная Описание
Universal.Light Светлая тема (по умолчанию)
Universal.Dark Тёмная тема
Universal.System Системная тема

Установив тему на System, выбирается светлая или тёмная тема в зависимости от цветов системной темы. Однако при чтении значения свойства темы, значение никогда не будет System, а будет фактической темой.

В следующем примере тема для панели и кнопки установлена как Universal.Dark:

Pane {
    Universal.theme: Universal.Dark

    Button {
        text: qsTr("Button")
    }
}

Документация по присоединённым методам

цвет color(перечисление predefined)

Этот присоединённый метод возвращает эффективное значение цвета указанного предварительно определённого цвета Universal.

Rectangle {
    color: Universal.color(Universal.Red)
}

Связанная информация

  • Стилизация Qt Quick Controls

© The Qt Company Ltd
Licensed under the GNU Free Documentation License, Version 1.3.
https://doc.qt.io/qt-6.1/qtquickcontrols2-universal.html

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API