Spec-Zone.ru › Qt 5.11

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

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

Оператор импорта: import QtQuick.Controls.Universal 2.4
С момента: Qt 5.7

Прикреплённые свойства

  • accent : цвет
  • background : цвет
  • foreground : цвет
  • theme : перечисление

Прикреплённые методы

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

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

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

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

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

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

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

Настройка

Универсальный стиль позволяет настраивать четыре атрибута: theme, accent, foreground и background.

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

import QtQuick 2.0
import QtQuick.Controls 2.1
import QtQuick.Controls.Universal 2.1

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 Указывает значение по умолчанию темы Universal. Значение может быть одним из доступных тем, например "Dark".
Accent Указывает цвет акцента по умолчанию Universal. Значение может быть любым цветом, но рекомендуется использовать один из предварительно определённых цветов Universal, например "Violet".
Foreground Указывает цвет фона по умолчанию Universal. Значение может быть любым цветом или одним из предварительно определённых цветов Universal, например "Brown".
Background Указывает цвет фона по умолчанию Universal. Значение может быть любым цветом или одним из предварительно определённых цветов Universal, например "Steel".

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

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

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

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

Зависимость

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

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

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

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

Константа Описание
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.accent : цвет

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

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

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

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

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

Universal.background : цвет

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

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

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

Pane {
    Universal.background: Universal.Steel

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

Universal.foreground : color

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

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

В следующем примере цвет переднего плана кнопки установлен на 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 2

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

Spec-Zone.ru

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