Тип 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.

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

orientation : перечисление

Установите это свойство для определения направления градиента.

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

По умолчанию установлено Gradient.Vertical.

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

[default] stops : список<GradientStop>

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

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

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