Gradient QML Type

Définit un remplissage dégradé. En savoir plus…

• Liste de tous les membres, y compris les membres hérités

Propriétés

• orientation : enumeration
• stops : list<GradientStop>

Description détaillée

Un dégradé est défini par deux couleurs ou plus, qui s'estompent en douceur.

Les couleurs sont spécifiées sous la forme d’un ensemble d’éléments enfants de type « GradientStop », dont chacun définit une position sur le dégradé comprise entre 0,0 et 1,0, ainsi qu’une couleur. La position de chaque élément « GradientStop » est définie en configurant sa propriété « position » ; sa couleur est définie à l’aide de sa propriété « color ».

Un dégradé sans aucune halte de dégradé est affiché sous la forme d’un remplissage blanc uni.

Notez que cet élément n’est pas une représentation visuelle d’un dégradé. Pour afficher un dégradé, utilisez un élément visuel (tel que Rectangle) prenant en charge l’utilisation des dégradés.

Exemple d'utilisation

L'exemple suivant déclare un élément « Rectangle » avec un dégradé commençant par le rouge, se fondant dans le jaune à un tiers de la hauteur du rectangle, et se terminant par le vert :

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

Performances et limitations

Le calcul des dégradés peut être coûteux en termes de ressources par rapport à l’utilisation de remplissages de couleur unie ou d’images. Envisagez d’utiliser des dégradés pour les éléments statiques d’une interface utilisateur.

Depuis Qt 5.12, des dégradés linéaires verticaux et horizontaux peuvent être appliqués aux éléments. Si vous devez appliquer des dégradés inclinés, vous pouvez combiner une rotation et un recadrage sur les éléments concernés. Vous pouvez également envisager d’utiliser ` QtQuick.Shapes::LinearGradient` ou `QtGraphicalEffects::LinearGradient`. Ces approches peuvent toutes entraîner des exigences supplémentaires en matière de performances pour votre application.

L'utilisation d'animations impliquant des arrêts de dégradé peut ne pas donner le résultat escompté. Une autre façon d'animer des dégradés consiste à utiliser des images pré-générées ou des dessins SVG contenant des dégradés.

Voir également GradientStop.

Documentation sur les propriétés

orientation : enumeration

Définissez cette propriété pour déterminer la direction du dégradé.

La valeur par défaut est Gradient.Vertical.

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

Cette propriété contient les étapes de dégradé qui décrivent le dégradé.

Par défaut, cette propriété contient une liste vide.

Pour définir les arrêts de dégradé, définissez-les en tant qu'éléments enfants du Gradient.