Spec-Zone.ru › Qt 5.9

Тип QML CircularGaugeStyle

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

Заявление об импорте: import QtQuick.Controls.Styles 1.4
С момента: Qt 5.5
  • Список всех членов, включая унаследованные

Свойства

  • angleRange : real
  • background : Компонент
  • control : CircularGauge
  • foreground : Компонент
  • labelCount : int
  • labelInset : real
  • labelStepSize : real
  • maximumValueAngle : real
  • minimumValueAngle : real
  • minorTickmark : Компонент
  • minorTickmarkCount : int
  • minorTickmarkInset : real
  • needle : Компонент
  • needleRotation : real
  • outerRadius : real
  • tickmark : Компонент
  • tickmarkCount : int
  • tickmarkInset : real
  • tickmarkLabel : Компонент
  • 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)
        }
    }
}

Результат:

CircularGaugeStyle example

Направление

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

Reversed CircularGauge

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

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

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

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

background : Компонент

Фон циферблата.

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

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

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

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

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

foreground : Компонент

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

Как и 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 : Компонент

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

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

readonly property int styleData.index Индекс этой метки.
readonly property real styleData.value Значение, которое представляет эта метка.

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

minorTickmarkCount : int

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

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

См. также tickmarkCount.

minorTickmarkInset : real

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

needle : Component

Игла, указывающая на текущее значение шкалы.

Этот компонент рисуется под компонентом foreground.

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

CircularGauge's needle

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

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

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

needleRotation : real

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

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

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

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

tickmark : Component

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

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

readonly property int styleData.index Индекс этой риски.
readonly property real styleData.value Значение, которое представляет эта риска.

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

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
        }
    }
}

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

Tickmarks

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

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

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

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

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

См. также minorTickmarkCount.

tickmarkInset : real

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

tickmarkLabel : Component

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

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

readonly property int styleData.index Индекс этой метки.
readonly property real styleData.value Значение, которое представляет эта метка.

См. также Настройка меток рисок 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.

© The Qt Company Ltd
Licensed under the GNU Free Documentation License, Version 1.3.
https://doc.qt.io/qt-5.9/qml-qtquick-controls-styles-circulargaugestyle.html

Spec-Zone.ru

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