Тип QML Градиент

Определяет заполнение градиентом. Подробнее...

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

Свойства

• orientation : перечисление
• stops : список<GradientStop>

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

Градиент определяется двумя или более цветами, которые плавно смешиваются.

Цвета задаются набором дочерних элементов GradientStop, каждый из которых определяет позицию на градиенте от 0,0 до 1,0 и цвет. Позиция каждого GradientStop определяется установкой свойства position; его цвет определяется с помощью свойства color.

Градиент без градиентных остановок отображается как сплошная белая заливка.

Обратите внимание, что этот элемент не является визуальным представлением градиента. Для отображения градиента используйте визуальный элемент (например, Rectangle), который поддерживает использование градиентов.

Пример использования

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

Rectangle {
    width: 100; height: 100
    gradient: Gradient {
        GradientStop { position: 0.0; color: "red" }
        GradientStop { position: 0.33; color: "yellow" }
        GradientStop { position: 1.0; color: "green" }
    }
}

Производительность и ограничения

Вычисление градиентов может быть вычислительно дорогостоящим по сравнению с использованием сплошных заливок или изображений. Рассмотрите использование градиентов для статических элементов в пользовательском интерфейсе.

Начиная с Qt 5.12, вертикальные и горизонтальные линейные градиенты могут применяться к элементам. Если вам необходимо применить наклонные градиенты, можно применить сочетание вращения и обрезки к соответствующим элементам. В качестве альтернативы можно использовать QtQuick.Shapes::LinearGradient или QtGraphicalEffects::LinearGradient. Все эти подходы могут потребовать дополнительных требований к производительности вашей программы.

Использование анимаций, включающих градиентные остановки, может не дать желаемого результата. Альтернативным способом анимации градиентов является использование предварительно сгенерированных изображений или SVG-рисунков, содержащих градиенты.

См. такжеGradientStop.

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

[с 5.12] orientation : перечисление

Установите это свойство, чтобы определить направление градиента.

• Gradient.Vertical - вертикальный градиент
• Gradient.Horizontal - горизонтальный градиент

По умолчанию значение Gradient.Vertical.

Это свойство было введено в Qt 5.12.

[по умолчанию] stops : список<GradientStop>

Это свойство содержит градиентные остановки, описывающие градиент.

По умолчанию это свойство содержит пустой список.

Для установки градиентных остановок определите их как дочерние элементы градиента.