DropShadow QML Type

Génère une ombre douce derrière l'élément source. Plus d'informations...

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

Propriétés

• cached : alias
• color : alias
• horizontalOffset : real
• radius : int
• samples : alias
• source : alias
• spread : alias
• transparentBorder : alias
• verticalOffset : real

Description détaillée

L'effet DropShadow brouille le canal alpha de l'entrée, colore le résultat et le place derrière l'objet source pour créer une ombre douce. La couleur de l'ombre peut être modifiée à l'aide de la propriété color. L'emplacement de l'ombre peut être modifié à l'aide des propriétés horizontalOffset et verticalOffset.

L'ombre douce est créée en rendant l'image floue en direct à l'aide d'un flou gaussien. Effectuer un flou en direct est une opération coûteuse. Un flou gaussien plein écran, même avec un nombre modéré d'échantillons, ne fonctionnera qu'à 60 images par seconde sur du matériel graphique haut de gamme.

Lorsque la source est statique, la propriété cached peut être définie pour allouer un autre tampon afin d'éviter d'effectuer le flou à chaque fois qu'il est dessiné.

Exemple d'application

L'exemple suivant montre comment appliquer l'effet.

import QtQuick
import Qt5Compat.GraphicalEffects

Item {
    width: 300
    height: 300

    Rectangle {
        anchors.fill: parent
    }

    Image {
        id: butterfly
        source: "images/butterfly.png"
        sourceSize: Qt.size(parent.width, parent.height)
        smooth: true
        visible: false
    }

    DropShadow {
        anchors.fill: butterfly
        horizontalOffset: 3
        verticalOffset: 3
        radius: 8.0
        color: "#80000000"
        source: butterfly
    }
}

Documentation sur les propriétés

cached : alias

Cette propriété permet de mettre en cache les pixels de sortie de l'effet afin d'améliorer les performances de rendu. Chaque fois que les propriétés de la source ou de l'effet sont modifiées, les pixels du cache doivent être mis à jour. La consommation de mémoire augmente, car une mémoire tampon supplémentaire est nécessaire pour stocker la sortie de l'effet.

Il est recommandé de désactiver le cache lorsque les propriétés de la source ou de l'effet sont animées.

Par défaut, la propriété est définie sur false.

color : alias

Cette propriété définit la valeur de la couleur RGBA utilisée pour l'ombre.

Par défaut, la propriété est définie sur "black".

horizontalOffset : real

Les propriétés HorizontalOffset et verticalOffset définissent le décalage de l'ombre rendue par rapport à la position de l'élément DropShadow. Souvent, l'élément DropShadow est ancré de manière à remplir l'élément source. Dans ce cas, si les propriétés HorizontalOffset et verticalOffset sont définies sur 0, l'ombre est rendue exactement sous l'élément source. En modifiant les propriétés offset, l'ombre peut être positionnée par rapport à l'élément source.

Les valeurs vont de -inf à inf. Par défaut, les propriétés sont définies sur 0.

radius : int

Le rayon définit la douceur de l'ombre. Un rayon plus grand rend les bords de l'ombre plus flous.

Le flou idéal est obtenu en sélectionnant samples et radius de telle sorte que samples = 1 + radius * 2, par exemple :

Par défaut, la propriété est définie sur floor(samples/2).

samples : alias

Cette propriété définit le nombre d'échantillons prélevés par pixel lors du calcul du flou d'adoucissement des contours. Une valeur plus élevée permet d'obtenir une meilleure qualité, mais le rendu est plus lent.

Idéalement, cette valeur doit être deux fois plus grande que la valeur de rayon la plus élevée plus un, comme par exemple :

Par défaut, la propriété est fixée à 9.

Cette propriété n'est pas destinée à être animée. La modification de cette propriété entraînera la recompilation des shaders OpenGL sous-jacents.

source : alias

Cette propriété définit l'élément source qui sera utilisé comme source pour l'ombre générée.

spread : alias

Cette propriété définit la proportion de la couleur de l'ombre qui est renforcée près des bords de la source.

La valeur est comprise entre 0,0 et 1,0. Par défaut, la propriété est définie sur 0.0.

transparentBorder : alias

Cette propriété détermine si l'effet a une bordure transparente ou non.

Lorsque cette propriété vaut true, l'extérieur de l'élément est complété par un bord transparent de 1 pixel de large, ce qui fait que l'échantillonnage à l'extérieur de la texture source utilise la transparence à la place des pixels du bord. Sans cette propriété, une image dont les bords sont opaques n'obtiendra pas d'ombre floue.

Dans l'image ci-dessous, le rectangle de gauche a des bords transparents et des bords flous, alors que le rectangle de droite n'en a pas :

Par défaut, cette propriété est fixée à true.

import QtQuick
import Qt5Compat.GraphicalEffects

Rectangle {
    width: 180
    height: 100

    Row {
        anchors.centerIn: parent
        spacing: 16

        Rectangle {
            id: normalRect
            width: 60
            height: 60
            radius: 10
            color: "steelblue"
            layer.enabled: true
            layer.effect: DropShadow {
                transparentBorder: false
                horizontalOffset: 8
                verticalOffset: 8
            }
        }

        Rectangle {
            id: transparentBorderRect
            width: 60
            height: 60
            radius: 10
            color: "steelblue"
            layer.enabled: true
            layer.effect: DropShadow {
                transparentBorder: true
                horizontalOffset: 8
                verticalOffset: 8
            }
        }
    }
}

verticalOffset : real

Les propriétés HorizontalOffset et verticalOffset définissent le décalage de l'ombre rendue par rapport à la position de l'élément DropShadow. Souvent, l'élément DropShadow est ancré de manière à remplir l'élément source. Dans ce cas, si les propriétés HorizontalOffset et verticalOffset sont définies sur 0, l'ombre est rendue exactement sous l'élément source. En modifiant les propriétés offset, l'ombre peut être positionnée par rapport à l'élément source.

Les valeurs vont de -inf à inf. Par défaut, les propriétés sont définies sur 0.