Gradient QML Type

Definiert eine Farbverlaufsfüllung. Mehr...

• Liste aller Elemente, einschließlich geerbter Elemente

Eigenschaften

• orientation : enumeration
• stops : list<GradientStop>

Ausführliche Beschreibung

Ein Farbverlauf wird durch zwei oder mehr Farben definiert, die nahtlos ineinander übergehen.

Die Farben werden als eine Reihe von untergeordneten „ GradientStop “-Elementen angegeben, von denen jedes eine Position auf dem Farbverlauf zwischen 0,0 und 1,0 sowie eine Farbe definiert. Die Position jedes „ GradientStop “-Elements wird durch die Einstellung seiner „ position “-Eigenschaft festgelegt; seine Farbe wird über die „ color “-Eigenschaft definiert.

Ein Farbverlauf ohne Farbverlaufsstopps wird als durchgehende weiße Füllung dargestellt.

Beachten Sie, dass dieses Element keine visuelle Darstellung eines Farbverlaufs ist. Um einen Farbverlauf anzuzeigen, verwenden Sie ein visuelles Element (wie z. B. Rectangle), das die Verwendung von Farbverläufen unterstützt.

Anwendungsbeispiel

Das folgende Beispiel deklariert ein „ Rectangle “-Element mit einem Farbverlauf, der bei Rot beginnt, bei einem Drittel der Höhe des Rechtecks in Gelb übergeht und bei Grün endet:

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

Leistung und Einschränkungen

Die Berechnung von Farbverläufen kann im Vergleich zur Verwendung von einfarbigen Füllungen oder Bildern rechenintensiv sein. Ziehen Sie die Verwendung von Farbverläufen für statische Elemente in einer Benutzeroberfläche in Betracht.

Seit Qt 5.12 können vertikale und horizontale lineare Farbverläufe auf Elemente angewendet werden. Wenn Sie schräge Farbverläufe anwenden müssen, können Sie eine Kombination aus Drehung und Beschneidung auf die entsprechenden Elemente anwenden. Alternativ können Sie die Verwendung von ` QtQuick.Shapes::LinearGradient` oder `QtGraphicalEffects::LinearGradient` in Betracht ziehen. Diese Ansätze können alle zusätzliche Anforderungen an die Leistung Ihrer Anwendung mit sich bringen.

Die Verwendung von Animationen mit Farbverlaufsstopps führt möglicherweise nicht zum gewünschten Ergebnis. Eine alternative Möglichkeit, Farbverläufe zu animieren, ist die Verwendung von vorgefertigten Bildern oder SVG-Zeichnungen, die Farbverläufe enthalten.

Siehe auch GradientStop.

Dokumentation zu Eigenschaften

orientation : enumeration

Legen Sie diese Eigenschaft fest, um die Richtung des Farbverlaufs zu definieren.

Der Standardwert ist „Gradient.Vertical“.

stops : list<GradientStop> [default read-only]

Diese Eigenschaft enthält die Farbverläufe, die den Farbverlauf beschreiben.

Standardmäßig enthält diese Eigenschaft eine leere Liste.

Um die Farbverlaufsstopps festzulegen, definieren Sie diese als untergeordnete Elemente des Farbverlaufs.