GradientBevelFilter  - AS3

Tableau de valeurs de transparence alpha pour les couleurs correspondantes du tableau colors. Les valeurs valides pour chaque élément du tableau sont comprises entre 0 et 1. Par exemple, 0,25 définit une valeur de transparence de 25 %.

La propriété alphas ne peut pas être modifiée en manipulant directement ses valeurs. Vous devez obtenir une référence à alphas, effectuer les modifications sur la référence, puis définir la propriété alphas sur la référence.

Les propriétés colors, alphas et ratios sont liées. Le premier élément du tableau colors correspond au premier élément du tableau alphas, du tableau ratios, etc.

Eléments de l’API associés

Angle, exprimé en degrés. Les valeurs possibles sont comprises entre 0 et 360. La valeur par défaut est 45.

La valeur d’angle représente l’angle de la source lumineuse théorique éclairant l’objet. La valeur détermine l’angle selon lequel les couleurs de dégradé sont appliquées à l’objet : soit où la surbrillance et l’ombre apparaissent, soit où la première couleur du tableau apparaît. Les couleurs sont ensuite appliquées selon leur ordre d’apparition dans le tableau.

Eléments de l’API associés

Quantité de flou horizontal. Les valeurs possibles sont comprises entre 0 et 255. Un flou d’une valeur inférieure ou égale à 1 signifie que l’image d’origine n’est pas modifiée avant d’être copiée. La valeur par défaut est 4. Les valeurs correspondant à une puissance de 2 (telles que 2, 4, 8, 16 et 32) sont optimisées pour obtenir un rendu plus rapide qu’avec les autres valeurs.

Quantité de flou vertical. Les valeurs possibles sont comprises entre 0 et 255. Un flou d’une valeur inférieure ou égale à 1 signifie que l’image d’origine n’est pas modifiée avant d’être copiée. La valeur par défaut est 4. Les valeurs correspondant à une puissance de 2 (telles que 2, 4, 8, 16 et 32) sont optimisées pour obtenir un rendu plus rapide qu’avec les autres valeurs.

Tableau de valeurs hexadécimales de couleur RVB à utiliser pour le dégradé. Par exemple, rouge correspond à 0xFF0000, bleu à 0x0000FF, etc.

La propriété colors ne peut pas être modifiée en manipulant directement ses valeurs. Vous devez obtenir une référence à colors, effectuer les modifications sur la référence, puis définir la propriété colors sur la référence.

Les propriétés colors, alphas et ratios sont liées. Le premier élément du tableau colors correspond au premier élément du tableau alphas, du tableau ratios, etc.

Eléments de l’API associés

La distance de décalage. Les valeurs valides sont comprises entre 0 et 8. La valeur par défaut est 4.0.

Spécifie si l’objet a un effet de masquage. Un effet de masquage rend le remplissage de l’objet transparent et révèle la couleur d’arrière-plan du document. La valeur true spécifie un effet de masquage ; la valeur par défaut est false (pas d’effet de masquage).

Nombre d’applications du filtre. La valeur par défaut est BitmapFilterQuality.LOW, ce qui revient à appliquer le filtre une seule fois. La valeur BitmapFilterQuality.MEDIUM applique le filtre deux fois. La valeur BitmapFilterQuality.HIGH l’applique trois fois. Les rendus des filtres de valeurs faibles sont obtenus plus rapidement.

Pour la plupart des applications, une valeur de quality faible, moyenne ou élevée est suffisante. Il est possible d’utiliser des valeurs numériques allant jusqu’à 15 pour obtenir différents effets, mais le rendu des valeurs les plus élevées est moins rapide. Sans augmenter la valeur de quality, vous pouvez généralement obtenir un effet similaire, avec un rendu plus rapide, en augmentant simplement les valeurs des propriétés blurX et blurY.

Eléments de l’API associés

Tableau de taux de répartition des couleurs, pour les couleurs correspondantes du tableau colors. Les valeurs valides pour chaque élément du tableau sont comprises entre 0 et 255.

La propriété ratios ne peut pas être modifiée en manipulant directement ses valeurs. Vous devez obtenir une référence à ratios, effectuer les modifications sur la référence, puis définir la propriété ratios sur la référence.

Les propriétés colors, alphas et ratios sont liées. Le premier élément du tableau colors correspond au premier élément du tableau alphas, du tableau ratios, etc.

Pour comprendre comment les couleurs du biseau dégradé sont appliquées, considérez les couleurs que vous souhaitez intégrer à votre biseau dégradé. Un biseau simple possède une couleur d’éclairage et une couleur d’ombre. Un biseau dégradé possède un dégradé éclairé et un dégradé ombré. Supposons que l’éclairage apparaît dans l’angle supérieur gauche et l’ombre, dans l’angle inférieur droit. Et imaginons que l’une des utilisations possibles du filtre comporte quatre couleurs dans la zone éclairée et quatre dans l’ombre. En plus de l’éclairage et de l’ombre, le filtre utilise une couleur de remplissage de base qui apparaît à la jonction des zones éclairées et ombrées. Le nombre total de couleurs est donc neuf, et le nombre d’éléments correspondants dans le tableau des rapports, également neuf.

Si vous souhaitez obtenir un dégradé composé de bandes de différentes couleurs qui se mêlent les unes aux autres, chaque valeur de ratio définit l’emplacement de la couleur sur le rayon du dégradé, 0 représentant le point le plus éloigné et 255, le point le plus proche du centre du dégradé. En général, la valeur moyenne, 128, constitue la valeur de remplissage de base. Pour obtenir l’effet de biseau illustré ci-dessous, affectez les valeurs de ratio comme suit, en vous aidant des neuf couleurs d’exemple :

• Les quatre premières couleurs se situent dans la plage 0 à 127, chaque valeur étant supérieure ou égale à la précédente. Elles définissent le bord du biseau éclairé.
• La cinquième couleur (la couleur du milieu) correspond au remplissage de base et est définie sur 128. La valeur de pixel 128 définit le remplissage de base qui apparaît soit à l’extérieur de la forme (et au niveau des bords du biseau) si le type externe est spécifié, soit à l’intérieur de la forme en couvrant efficacement le remplissage même de l’objet, si le type spécifié est interne.
• Les quatre dernières couleurs se situent dans la plage 129 à 255, chaque valeur étant supérieure ou égale à la précédente. Elles définissent le bord du biseau ombré.

Pour obtenir une répartition équivalente des couleurs sur chaque bord, utilisez un nombre de couleurs impair, la couleur centrale constituant le remplissage de base. Distribuez les valeurs de manière homogène entre 0-127 et 129-255 pour vos couleurs, puis ajustez la valeur pour modifier la largeur de chaque bande de couleur du dégradé. Pour un biseau dégradé possédant neuf couleurs, le tableau [16, 32, 64, 96, 128, 160, 192, 224, 235] est possible. L’image suivante illustre le biseau dégradé décrit :

N’oubliez pas que la répartition des couleurs dans le dégradé varie en fonction des valeurs des propriétés blurX, blurY, strength et quality, ainsi que des valeurs de ratios.

Eléments de l’API associés

Intensité de l’empreinte ou recouvrement. Plus la valeur est élevée, plus le recouvrement est intense et plus le contraste est important entre le biseau et l’arrière-plan. Les valeurs possibles sont comprises entre 0 et 255. La valeur 0 signifie que le filtre n’est pas appliqué. La valeur par défaut est 1.

Eléments de l’API associés

Positionnement de l’effet biseau. Les valeurs possibles sont les constantes BitmapFilterType :

• BitmapFilterType.OUTER, biseau sur le bord extérieur de l’objet.
• BitmapFilterType.INNER, biseau sur le bord intérieur de l’objet.
• BitmapFilterType.FULL, biseau sur le dessus de l’objet.

Initialise le filtre avec les paramètres spécifiés.

Eléments de l’API associés

Renvoie une copie de cet objet filtre.

1. Importation des classes requises.
2. Déclaration des variables globales pour définir le carré et le filtre.
3. Création des fonctions constructeur qui effectuent les actions suivantes :
   • Appel de la méthode draw() qui utilise des méthodes de la classe Graphics, accessibles par le biais de la propriété graphics de Sprite, pour dessiner un carré gris.
   • Création d’un objet BitmapFilter nommé filter auquel est attribuée la valeur renvoyée d’un appel à getBitmapFilter() qui crée le filtre.
   • Création d’un nouveau tableau nommé myFilters auquel est ajouté filter.
   • Attribution de myFilters à la propriété filters de l’objet GradientBevelFilterExample. Ceci a pour effet d’appliquer tous les filtres trouvés dans myFilters, en l’occurrence filter uniquement.

package {
    import flash.display.Sprite;
    import flash.filters.BitmapFilter;
    import flash.filters.BitmapFilterQuality;
    import flash.filters.BitmapFilterType;
    import flash.filters.GradientBevelFilter;

    public class GradientBevelFilterExample extends Sprite {
        private var bgColor:uint     = 0xCCCCCC;
        private var size:uint        = 80;
        private var offset:uint      = 50;
        private var distance:Number  = 5;
        private var angleInDegrees:Number = 225; // opposite 45 degrees
        private var colors:Array     = [0xFFFFFF, 0xCCCCCC, 0x000000];
        private var alphas:Array     = [1, 0, 1];
        private var ratios:Array     = [0, 128, 255];
        private var blurX:Number     = 8;
        private var blurY:Number     = 8;
        private var strength:Number  = 2;
        private var quality:Number   = BitmapFilterQuality.HIGH
        private var type:String      = BitmapFilterType.INNER;
        private var knockout:Boolean = true;

        public function GradientBevelFilterExample() {
            draw();
            var filter:BitmapFilter = getBitmapFilter();
            var myFilters:Array = new Array();
            myFilters.push(filter);
            filters = myFilters;
        }

        private function getBitmapFilter():BitmapFilter {
            return new GradientBevelFilter(distance,
                                           angleInDegrees,
                                           colors,
                                           alphas,
                                           ratios,
                                           blurX,
                                           blurY,
                                           strength,
                                           quality,
                                           type,
                                           knockout);
        }

        private function draw():void {
            graphics.beginFill(bgColor);
            graphics.drawRect(offset, offset, size, size);
            graphics.endFill();
        }
    }
}