Тип QML CircularGaugeStyle

Предоставляет настраиваемую стилизацию для CircularGauge. Подробнее...

• Список всех членов, включая унаследованные

Свойства

• angleRange : real
• background : Component
• control : CircularGauge
• foreground : Component
• labelCount : int
• labelInset : real
• labelStepSize : real
• maximumValueAngle : real
• minimumValueAngle : real
• minorTickmark : Component
• minorTickmarkCount : int
• minorTickmarkInset : real
• needle : Component
• needleRotation : real
• outerRadius : real
• tickmark : Component
• tickmarkCount : int
• tickmarkInset : real
• tickmarkLabel : Component
• tickmarkStepSize : real

Методы

• real valueToAngle(real value)

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

Вы можете создать настраиваемую шкалу круговых показаний, заменив следующие делегаты:

• background
• tickmark
• minorTickmark
• tickmarkLabel
• needle
• foreground

Ниже приведен пример, который изменяет стрелку на простую оранжевую Прямоугольник:

CircularGauge {
    style: CircularGaugeStyle {
        needle: Rectangle {
            y: outerRadius * 0.15
            implicitWidth: outerRadius * 0.03
            implicitHeight: outerRadius * 0.9
            antialiasing: true
            color: Qt.rgba(0.66, 0.3, 0, 1)
        }
    }
}

Результат:

Направление

minimumValueAngle и maximumValueAngle определяют не только положение делений, меток и стрелки, но и направление, в котором они отображаются вокруг шкалы. Например, если minimumValueAngle больше maximumValueAngle, шкала будет отображаться против часовой стрелки. Ниже представлены две шкалы: верхняя шкала имеет minimumValueAngle в -90 градусах и maximumValueAngle в 90 градусах, а нижняя шкала имеет обратное значение.

См. также Стиль CircularGauge.

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

[только для чтения] angleRange : real

Диапазон между minimumValueAngle и maximumValueAngle в градусах. Это значение всегда будет положительным.

background : Component

Фон шкалы.

Если задано, фон определяет неявный размер шкалы.

По умолчанию фон не определен.

См. также Стиль фона CircularGauge.

[только для чтения] control : CircularGauge

Объект CircularGauge, к которому прикреплен этот стиль.

foreground : Component

Передний план шкалы. Этот компонент отображается поверх всех остальных.

Как и background, компонент переднего плана заполняет всю шкалу.

По умолчанию здесь определена ручка шкалы.

См. также Стиль переднего плана CircularGauge.

[только для чтения] labelCount : int

Количество меток делений, отображаемых на шкале, вычисляется из labelStepSize и значений minimumValue и maximumValue элемента управления.

См. также tickmarkCount и minorTickmarkCount.

labelInset : real

Расстояние в пикселях от внешнего края шкалы (outerRadius) до центра текста метки значения.

labelStepSize : real

Интервал, через который отображаются метки делений.

Например, если это свойство установлено в 10 (по умолчанию), control.minimumValue в 0, а control.maximumValue в 100, отображаемые метки делений будут 0, 10, 20 и т. д. до 100 вокруг шкалы.

maximumValueAngle : real

Это свойство определяет угол, на котором отображается максимальное значение на шкале.

Установленный угол влияет на следующие компоненты шкалы:

• Угол стрелки
• Положение делений и меток

Начало отсчёта угла — север:

Для этого свойства нет минимального или максимального значения, но стандартный стиль поддерживает углы, абсолютный диапазон которых не превышает 360 градусов. Это потому, что диапазоны, превышающие 360 градусов, приведут к перекрытию делений и меток.

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

minimumValueAngle : real

Это свойство определяет угол, на котором отображается минимальное значение на шкале.

Установленный угол влияет на следующие компоненты шкалы:

• Угол стрелки
• Положение делений и меток

Начало отсчёта угла — север:

Для этого свойства нет минимального или максимального значения, но стандартный стиль поддерживает углы, абсолютный диапазон которых не превышает 360 градусов. Это потому, что диапазоны, превышающие 360 градусов, приведут к перекрытию делений и меток.

Значение по умолчанию — -145.

minorTickmark : Component

Этот компонент определяет каждое отдельное малое деление. Положение каждого малого деления уже задано; необходимо только указать implicitWidth и implicitHeight.

Каждый экземпляр этого компонента имеет доступ к следующим свойствам:

См. также Стиль малых делений CircularGauge.

minorTickmarkCount : int

Количество мелких рисок между каждой риской.

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

См. также tickmarkCount.

minorTickmarkInset : real

Расстояние в пикселях от внешнего края циферблата (outerRadius) до самой внешней точки линии мелкой риски.

needle : Component

Игла, указывающая на текущее значение циферблата.

Этот компонент отображается под компонентом foreground.

Стиль ожидает, что игла будет направлена вверх при повороте на 0, для правильного отображения поворота. Например:

При определении собственного компонента иглы, единственными свойствами, которые необходимо установить для стиля, являются implicitWidth и implicitHeight.

Необязательно, можно установить x и y для изменения точки начала преобразования иглы. Установка значения x может быть полезна для изображений иглы, где игла не расположена точно по центру горизонтально. Установка значения y позволяет сделать основание иглы выступающим за центр циферблата.

См. также Настройка иглы CircularGauge.

needleRotation : real

Это свойство содержит угол поворота иглы в градусах.

[только для чтения] outerRadius : real

Расстояние от центра циферблата до внешнего края циферблата.

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

tickmark : Component

Этот компонент определяет каждую отдельную риску. Позиция каждой риски уже установлена; необходимо указать только implicitWidth и implicitHeight.

Каждый экземпляр этого компонента имеет доступ к следующим свойствам:

Для иллюстрации того, что эти свойства обозначают, можно использовать следующий пример:

import QtQuick 2.0
import QtQuick.Controls.Styles 1.4
import QtQuick.Extras 1.4

Rectangle {
    width: 400
    height: 400

    CircularGauge {
        id: gauge
        anchors.fill: parent
        style: CircularGaugeStyle {
            labelInset: outerRadius * 0.2

            tickmarkLabel: null

            tickmark: Text {
                text: styleData.value

                Text {
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.top: parent.bottom
                    text: styleData.index
                    color: "blue"
                }
            }

            minorTickmark: Text {
                text: styleData.value
                font.pixelSize: 8

                Text {
                    anchors.horizontalCenter: parent.horizontalCenter
                    anchors.top: parent.bottom
                    text: styleData.index
                    font.pixelSize: 8
                    color: "blue"
                }
            }
        }

        Text {
            id: indexText
            text: "Major and minor indices"
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.bottom: valueText.top
            color: "blue"
        }
        Text {
            id: valueText
            text: "Major and minor values"
            anchors.horizontalCenter: parent.horizontalCenter
            anchors.bottom: parent.bottom
        }
    }
}

Мы заменили обычные риски-линии элементами Text и скрыли компонент tickmarkLabel, чтобы сделать связь более ясной:

Свойство индекса может быть полезно, если у вас есть другая модель, содержащая изображения для отображения для каждого индекса, например.

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

См. также Настройка рисок CircularGauge.

[только для чтения] tickmarkCount : int

Количество рисок, отображаемых циферблатом, рассчитывается из tickmarkStepSize и свойств minimumValue и maximumValue элемента управления.

См. также minorTickmarkCount.

tickmarkInset : real

Расстояние в пикселях от внешнего края циферблата (outerRadius) до самой внешней точки линии риски.

tickmarkLabel : Component

Определяет текст каждой метки риски на циферблате.

Каждый экземпляр этого компонента имеет доступ к следующим свойствам:

См. также Настройка меток рисок CircularGauge.

tickmarkStepSize : real

Интервал, с которым отображаются риски.

Например, если это свойство установлено в 10 (значение по умолчанию), control.minimumValue в 0, и control.maximumValue в 100, отображаемые риски будут 0, 10, 20 и т.д., до 100, вокруг циферблата.

Документация по методам

real valueToAngle(real value)

Возвращает value как угол в градусах.

Эта функция полезна для пользовательского рисования или позиционирования элементов в компонентах стиля. Например, её можно использовать для расчёта углов, под которыми рисовать дугу вокруг циферблата, показывающую безопасную область для иглы.

Например, если minimumValueAngle установлено в 270 и maximumValueAngle установлено в 90, эта функция вернёт 270 при передаче minimumValue и 90 при передаче maximumValue.

См. также Настройка фона CircularGauge.