Logo FluentUI

LinearGradient QML Type

A linear gradient shader effect. More...

Import Statement: import FluentUI.Controls 1.0

Properties

Detailed Description

LinearGradient applies a smooth color transition between two or more color stops along a specified direction. It is implemented as a shader effect that can be applied to any visual item to create gradient fills.

Usage Example

 import QtQuick
 import FluentUI.Controls

 Rectangle {
     width: 200
     height: 100
     layer.enabled: true
     layer.effect: LinearGradient {
         start: Qt.point(0, 0)
         end: Qt.point(width, 0)
         gradientStops: [
             GradientStop { position: 0.0; color: "red" },
             GradientStop { position: 1.0; color: "blue" }
         ]
     }
 }

Property Documentation

cached : bool

Whether the shader output should be cached. When true, the effect is rendered once and cached, improving performance at the cost of memory.

end : point

The ending point of the gradient line, specified in pixel coordinates relative to the source item.

gradientStops : list

The list of GradientStop objects that define the color positions along the gradient line.

source : Item

The source Item that the gradient effect is applied to.

start : point

The starting point of the gradient line, specified in pixel coordinates relative to the source item.