Тип QML GaugeStyle
Предоставляет настраиваемую стилизацию для Gauge. Подробнее...
| Заявление об импорте: | import QtQuick.Controls.Styles 1.4 |
| С момента: | Qt 5.5 |
Свойства
- background : Компонент
- control : Gauge
- foreground : Компонент
- minorTickmark : Компонент
- tickmark : Компонент
- tickmarkLabel : Компонент
- valueBar : Компонент
- valuePosition : вещественный
Подробное описание
Вы можете создать пользовательскую шкалу, заменив следующие делегаты:
Ниже приведен пример создания шкалы температуры, которая меняет цвет по мере увеличения ее значения:
import QtQuick 2.2
import QtQuick.Controls 1.4
import QtQuick.Controls.Styles 1.4
import QtQuick.Extras 1.4
Rectangle {
width: 80
height: 200
Timer {
running: true
repeat: true
interval: 2000
onTriggered: gauge.value = gauge.value == gauge.maximumValue ? 5 : gauge.maximumValue
}
Gauge {
id: gauge
anchors.fill: parent
anchors.margins: 10
value: 5
Behavior on value {
NumberAnimation {
duration: 1000
}
}
style: GaugeStyle {
valueBar: Rectangle {
implicitWidth: 16
color: Qt.rgba(gauge.value / gauge.maximumValue, 0, 1 - gauge.value / gauge.maximumValue, 1)
}
}
}
} Измеритель, отображающий значения в различные моменты анимации.
См. также Стиль Gauge.
Документация по свойствам
background : Component
Фон шкалы, отображаемый за valueBar.
По умолчанию фон не определен.
[только для чтения] control : Gauge
Gauge, к которому прикреплен этот стиль.
foreground : Component
Полоса, представляющая передний план шкалы.
Этот компонент отображается над всеми другими компонентами.
minorTickmark : Component
Каждая мелкая метка, отображаемая на шкале.
Чтобы установить размер мелких меток, укажите implicitWidth и implicitHeight.
По соображениям макета каждая мелкая метка должна иметь одинаковую implicitHeight. Если требуется разная высота для отдельных меток, укажите эти высоты в дочернем элементе компонента.
В приведенном ниже примере мы уменьшаем ширину мелких меток:
minorTickmark: Item {
implicitWidth: 8
implicitHeight: 1
Rectangle {
color: "#cccccc"
anchors.fill: parent
anchors.leftMargin: 2
anchors.rightMargin: 4
}
} Каждый экземпляр этого компонента имеет доступ к следующему свойству:
readonly property int styleData.index
|
Индекс этой мелкой метки. |
readonly property real styleData.value
|
Значение, которое представляет эта мелкая метка. |
readonly property real styleData.valuePosition
|
Значение, которое представляет эта мелкая метка, как позиция в пикселях, где 0 соответствует нижней части шкалы. |
См. также tickmark.
tickmark : Component
Каждая метка, отображаемая на шкале.
Чтобы установить размер меток, укажите implicitWidth и implicitHeight.
Самая широкая метка определит пространство, отведенное для всех меток. По этой причине implicitWidth каждой метки должна быть больше или равна меткам. Если вам нужны мелко метки с большей шириной, чем основные метки, задайте большую ширину в дочернем элементе компонента minorTickmark.
По соображениям макета каждая метка должна иметь одинаковую implicitHeight. Если требуется разная высота для отдельных меток, укажите эти высоты в дочернем элементе компонента.
В приведенном ниже примере мы уменьшаем высоту меток:
tickmark: Item {
implicitWidth: 18
implicitHeight: 1
Rectangle {
color: "#c8c8c8"
anchors.fill: parent
anchors.leftMargin: 3
anchors.rightMargin: 3
}
} Каждый экземпляр этого компонента имеет доступ к следующим свойствам:
readonly property int styleData.index
|
Индекс этой метки. |
readonly property real styleData.value
|
Значение, которое представляет эта метка. |
readonly property real styleData.valuePosition
|
Значение, которое представляет эта метка, как позиция в пикселях, где 0 соответствует нижней части шкалы. |
См. также minorTickmark.
tickmarkLabel : Component
Определяет текст каждой метки на шкале.
Каждый экземпляр этого компонента имеет доступ к следующим свойствам:
readonly property int styleData.index
|
Индекс этой метки. |
readonly property real styleData.value
|
Значение, которое представляет эта метка. |
valueBar : Component
Полоса, представляющая значение шкалы.
Высота полосы значений автоматически изменяется в соответствии с value и не требует указания.
При определении пользовательской valueBar ее свойство implicitWidth должно быть задано.
[только для чтения] valuePosition : real
Это свойство содержит значение, отображаемое на шкале, как позицию в пикселях.
Это полезно для пользовательской стилизации.
© The Qt Company Ltd
Licensed under the GNU Free Documentation License, Version 1.3.
https://doc.qt.io/qt-5.12/qml-qtquick-controls-styles-gaugestyle.html