Тип QML RadialGradient
Рисует радиальный градиент. Подробнее...
| Заявление об импорте: | import QtGraphicalEffects 1.14 |
| С: | QtGraphicalEffects 1.0 |
| Наследует: |
Свойства
- angle : real
- cached : bool
- gradient : Gradient
- horizontalOffset : real
- horizontalRadius : real
- source : variant
- verticalOffset : real
- verticalRadius : real
Подробное описание
Градиент определяется двумя или более цветами, которые плавно смешиваются. Цвета начинаются от центра элемента и заканчиваются на границах.
| Применяемый эффект |
|---|
Примечание: Этот эффект доступен при работе с OpenGL.
Пример
Следующий пример демонстрирует, как применить эффект.
import QtQuick 2.12
import QtGraphicalEffects 1.12
Item {
width: 300
height: 300
RadialGradient {
anchors.fill: parent
gradient: Gradient {
GradientStop { position: 0.0; color: "white" }
GradientStop { position: 0.5; color: "black" }
}
}
} Документация по свойствам
angle : real
Это свойство определяет поворот градиента вокруг его центральной точки. Поворот виден только тогда, когда свойства horizontalRadius и verticalRadius не равны. Угол задается в градусах, а значение по умолчанию равно 0.
| Примеры вывода с разными значениями угла | ||
|---|---|---|
| angle: 0 | angle: 45 | angle: 90 |
| horizontalOffset: 0 | horizontalOffset: 0 | horizontalOffset: 0 |
| verticalOffset: 0 | verticalOffset: 0 | verticalOffset: 0 |
| horizontalRadius: 100 | horizontalRadius: 100 | horizontalRadius: 100 |
| verticalRadius: 300 | verticalRadius: 300 | verticalRadius: 300 |
cached : bool
Это свойство позволяет кэшировать выходные пиксели эффекта для повышения производительности рендеринга.
Каждый раз при изменении свойств источника или эффекта пиксели в кэше должны быть обновлены. Потребление памяти увеличивается, так как для хранения выходных данных эффекта требуется дополнительный буфер памяти.
Рекомендуется отключать кэш, когда свойства источника или эффекта анимируются.
По умолчанию свойство установлено в значение false.
gradient : Gradient
Градиент определяется двумя или более цветами, которые плавно смешиваются. Цвета задаются набором дочерних элементов GradientStop, каждый из которых определяет позицию в градиенте от 0,0 до 1,0 и цвет. Позиция каждого GradientStop определяется установкой свойства position. Цвет определяется установкой свойства color.
| Примеры вывода с разными значениями градиента | ||
|---|---|---|
gradient:Gradient {
GradientStop {
position: 0.000
color: Qt.rgba(1, 0, 0, 1)
}
GradientStop {
position: 0.167
color: Qt.rgba(1, 1, 0, 1)
}
GradientStop {
position: 0.333
color: Qt.rgba(0, 1, 0, 1)
}
GradientStop {
position: 0.500
color: Qt.rgba(0, 1, 1, 1)
}
GradientStop {
position: 0.667
color: Qt.rgba(0, 0, 1, 1)
}
GradientStop {
position: 0.833
color: Qt.rgba(1, 0, 1, 1)
}
GradientStop {
position: 1.000
color: Qt.rgba(1, 0, 0, 1)
}
} |
gradient:Gradient {
GradientStop {
position: 0.0
color: "#F0F0F0"
}
GradientStop {
position: 0.5
color: "#000000"
}
GradientStop {
position: 1.0
color: "#F0F0F0"
}
} |
gradient:Gradient {
GradientStop {
position: 0.0
color: "#00000000"
}
GradientStop {
position: 1.0
color: "#FF000000"
}
} |
| horizontalOffset: 0 | horizontalOffset: 0 | horizontalOffset: 0 |
| verticalOffset: 0 | verticalOffset: 0 | verticalOffset: 0 |
| horizontalRadius: 300 | horizontalRadius: 300 | horizontalRadius: 300 |
| verticalRadius: 300 | verticalRadius: 300 | verticalRadius: 300 |
| angle: 0 | angle: 0 | angle: 0 |
horizontalOffset : real
Свойства horizontalOffset и verticalOffset определяют смещение в пикселях для центральной точки градиента по сравнению с центром элемента.
Значения варьируются от -бесконечности до бесконечности. По умолчанию эти свойства установлены в значение 0.
| Примеры вывода с разными значениями horizontalOffset | ||
|---|---|---|
| horizontalOffset: -150 | horizontalOffset: 0 | horizontalOffset: 150 |
| verticalOffset: 0 | verticalOffset: 0 | verticalOffset: 0 |
| horizontalRadius: 300 | horizontalRadius: 300 | horizontalRadius: 300 |
| verticalRadius: 300 | verticalRadius: 300 | verticalRadius: 300 |
| angle: 0 | angle: 0 | angle: 0 |
horizontalRadius : real
Свойства horizontalRadius и verticalRadius определяют форму и размер радиального градиента. Если радиусы равны, форма градиента — круг. Если горизонтальный и вертикальный радиусы отличаются, форма — эллипс. Радиусы задаются в пикселях.
Значение варьируется от -бесконечности до бесконечности. По умолчанию horizontalRadius привязан к ширине, а verticalRadius — к высоте.
| Примеры вывода с различными значениями horizontalRadius | ||
|---|---|---|
| horizontalRadius: 300 | horizontalRadius: 100 | |
| horizontalOffset: 0 | horizontalOffset: 0 | |
| verticalOffset: 0 | verticalOffset: 0 | |
| verticalRadius: 300 | verticalRadius: 300 | |
| угол: 0 | угол: 0 | |
| gradient: QQuickGradient(0xa05fb10) | gradient: QQuickGradient(0xa05fb10) |
источник : variant
Это свойство определяет элемент, который будет заполнен градиентом. Источник элемента отрисовывается в промежуточный буфер пикселей, а значения альфа из результата используются для определения видимости пикселей градиента на экране. Значение по умолчанию для источника — undefined, и в этом случае вся область эффекта заполняется градиентом.
| Примеры вывода с различными значениями источника | ||
|---|---|---|
| источник: undefined | источник: Image { source: images/butterfly.png } | |
| horizontalOffset: 0 | horizontalOffset: 0 | |
| verticalOffset: 0 | verticalOffset: 0 | |
| horizontalRadius: 300 | horizontalRadius: 300 | |
| verticalRadius: 300 | verticalRadius: 300 | |
| угол: 0 | угол: 0 |
Примечание: Не поддерживается включение эффекта в себя, например, путем установки источника в родительский элемент эффекта.
verticalOffset : real
Свойства horizontalOffset и verticalOffset определяют смещение в пикселях центральной точки градиента относительно центра элемента.
Значения варьируются от -inf до inf. По умолчанию эти свойства установлены в 0.
| Примеры вывода с различными значениями horizontalOffset | ||
|---|---|---|
| horizontalOffset: -150 | horizontalOffset: 0 | horizontalOffset: 150 |
| verticalOffset: 0 | verticalOffset: 0 | verticalOffset: 0 |
| horizontalRadius: 300 | horizontalRadius: 300 | horizontalRadius: 300 |
| verticalRadius: 300 | verticalRadius: 300 | verticalRadius: 300 |
| угол: 0 | угол: 0 | угол: 0 |
verticalRadius : real
Свойства horizontalRadius и verticalRadius определяют форму и размер радиального градиента. Если радиусы равны, форма градиента — круг. Если горизонтальный и вертикальный радиусы различаются, форма — эллипс. Радиусы задаются в пикселях.
Значение варьируется от -inf до inf. По умолчанию horizontalRadius привязан к ширине, а verticalRadius — к высоте.
| Примеры вывода с различными значениями horizontalRadius | ||
|---|---|---|
| horizontalRadius: 300 | horizontalRadius: 100 | |
| horizontalOffset: 0 | horizontalOffset: 0 | |
| verticalOffset: 0 | verticalOffset: 0 | |
| verticalRadius: 300 | verticalRadius: 300 | |
| угол: 0 | угол: 0 | |
| gradient: QQuickGradient(0xa05fb10) | gradient: QQuickGradient(0xa05fb10) |
© The Qt Company Ltd
Licensed under the GNU Free Documentation License, Version 1.3.
https://doc.qt.io/qt-5.14/qml-qtgraphicaleffects-radialgradient.html