Универсальный стиль
Универсальный стиль основан на Руководстве по универсальному дизайну Microsoft. Подробнее...
| Заявление импорта: | import QtQuick.Controls.Universal 2.2 |
| С тех пор: | Qt 5.7 |
Прикрепленные свойства
- акцент : цвет
- фон : цвет
- передний план : цвет
- тема : перечисление
Прикрепленные методы
- цвет цвет(предварительно определенное перечисление)
Подробное описание
Универсальный стиль — это независимый от устройства стиль, основанный на Руководстве по универсальному дизайну Microsoft. Универсальный стиль разработан для хорошего отображения на всех устройствах, от телефонов и планшетов до ПК.
|
Универсальный стиль в светлой теме |
Универсальный стиль в тёмной теме |
Чтобы запустить приложение с универсальным стилем, см. Использование стилей в Qt Quick Controls 2.
Примечание: Универсальный стиль не является родным стилем Windows 10. Универсальный стиль — это 100% кроссплатформенная реализация Qt Quick Controls 2, которая следует Руководству по универсальному дизайну Microsoft. Стиль работает на любой платформе и выглядит более или менее одинаково везде. Незначительные различия могут возникнуть из-за различий в доступных системных шрифтах и движках рендеринга шрифтов.
Настройка
Универсальный стиль позволяет настроить четыре атрибута: тема, акцент, передний план и фон.
Оба атрибута могут быть заданы для любого окна или элемента, и они автоматически распространяются на дочерние элементы аналогично шрифтам. В следующем примере окно и все три радиокнопки отображаются в тёмной теме с фиолетовым цветом акцента:
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 |
Устанавливает значение по умолчанию для универсальной темы. Значение может быть одним из доступных тем, например "Dark". |
Accent |
Устанавливает значение по умолчанию для цвета акцента универсального стиля. Значение может быть любым цветом, но рекомендуется использовать один из предварительно определённых цветов универсального стиля, например "Violet". |
Foreground |
Устанавливает значение по умолчанию для цвета переднего плана универсального стиля. Значение может быть любым цветом, или одним из предварительно определённых цветов универсального стиля, например "Brown". |
Background |
Устанавливает значение по умолчанию для цвета фона универсального стиля. Значение может быть любым цветом, или одним из предварительно определённых цветов универсального стиля, например "Steel". |
См. Файл конфигурации Qt Quick Controls 2 для получения более подробной информации о файле конфигурации.
Переменные среды
| Переменная | Описание |
|---|---|
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 2 для получения полного списка поддерживаемых переменных среды.
Зависимость
Универсальный стиль необходимо импортировать отдельно, чтобы получить доступ к атрибутам, специфичным для универсального стиля. Следует отметить, что независимо от ссылок на универсальный стиль, один и тот же код приложения работает с любым другим стилем. Атрибуты, специфичные для универсального стиля, действуют только при запуске приложения с универсальным стилем.
Если универсальный стиль импортирован в файл 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 : 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")
}
} |
Документация по присоединённым методам
цвет цвет(перечисление predefined)
Этот присоединённый метод возвращает эффективное значение цвета указанного предварительно определённого цвета Universal.
Rectangle {
color: Universal.color(Universal.Red)
} Связанная информация
© The Qt Company Ltd
Licensed under the GNU Free Documentation License, Version 1.3.
https://doc.qt.io/qt-5.9/qtquickcontrols2-universal.html