Utilisation d’un shader comme filtre

Utiliser un shader comme filtre s’apparente à l’utilisation de tout autre filtre dans ActionScript. Lorsque vous utilisez un shader en tant que filtre, l’image filtrée (un objet d’affichage ou un objet BitmapData) est transmise au shader. Le shader utilise l’image d’entrée pour créer le résultat du filtre, qui correspond généralement à une version modifiée de l’image d’origine. Si l’objet filtré est un objet d’affichage, le résultat du filtre remplace l’objet d’affichage filtré à l’écran. Si l’objet filtré est un objet BitmapData, le résultat du shader devient le contenu de l’objet BitmapData dont la méthode applyFilter() est appelée.

Pour utiliser un shader en tant que filtre, vous commencez par créer l’objet Shader, comme indiqué à la section Chargement ou intégration d’un shader . Vous créez ensuite un objet ShaderFilter lié à l’objet Shader. L’objet ShaderFilter est le filtre appliqué à l’objet filtré. Vous l’appliquez à un objet à l’instar de n’importe quel filtre. Vous le transmettez à la propriété filters d’un objet d’affichage ou vous appelez la méthode applyFilter() sur un objet BitmapData. Par exemple, le code suivant crée un objet ShaderFilter et applique le filtre à un objet d’affichage appelé homeButton .

var myFilter:ShaderFilter = new ShaderFilter(myShader); 
homeButton.filters = [myFilter];

Lorsque vous utilisez un shader en tant que filtre, une entrée au moins doit lui être associée. Comme indiqué dans l’exemple, vous ne définissez pas la valeur d’entrée dans le code. L’objet d’affichage filtré ou l’objet BitmapData est défini en tant qu’image d’entrée. Si vous utilisez un shader qui attend plus d’une entrée, vous en spécifiez la valeur à partir de la deuxième entrée.

Dans certains cas, un filtre modifie les dimensions de l’image d’origine. Un effet d’ombre portée standard ajoute par exemple des pixels contenant l’ombre associée à l’image. Lorsque vous utilisez un shader qui modifie les dimensions de l’image, définissez les propriétés leftExtension , rightExtension , topExtension et bottomExtension pour indiquer l’écart approprié.

L’exemple suivant illustre l’utilisation d’un shader en tant que filtre. Dans cet exemple, le filtre inverse les valeurs des canaux rouge, vert et bleu d’une image. Il a pour résultat un « négatif » de l’image.

Le code ActionScript important figure dans les deux méthodes suivantes :

• init() : la méthode init() est appelée lors du chargement de l’application. Dans cette méthode, le code charge le fichier de pseudo-code binaire du shader.

• onLoadComplete() : dans la méthode onLoadComplete() , le code crée l’objet Shader appelé shader . Il crée et dessine ensuite le contenu d’un objet appelé target . L’objet target est un rectangle rempli d’un dégradé linéaire rouge sur la gauche, jaune-vert au centre et bleu sur la droite. Si le filtre n’est pas appliqué, l’apparence de l’objet est la suivante :

  

  Si le filtre est appliqué, les couleurs sont inversées, auquel cas l’apparence du rectangle est la suivante :

  

Ce code utilise à titre de shader le noyau « invertRGB.pbk » Pixel Bender d’exemple intégré à Pixel Bender Toolkit. Le code source figure dans le fichier « invertRGB.pbk », qui réside dans le répertoire d’installation de Pixel Bender Toolkit. Compilez le code source et enregistrez le fichier de pseudo-code binaire sous le nom « invertRGB.pbj » dans le même répertoire que votre code source ActionScript.

Vous trouverez ci-dessous le code ActionScript associé à cet exemple : Utilisez cette classe en tant que classe d’application principale d’un projet ActionScript uniquement dans Flash Builder, ou en tant que classe de document du fichier FLA dans Flash Professional :

package 
{ 
    import flash.display.GradientType; 
    import flash.display.Graphics; 
    import flash.display.Shader; 
    import flash.display.Shape; 
    import flash.display.Sprite; 
    import flash.filters.ShaderFilter; 
    import flash.events.Event; 
    import flash.geom.Matrix; 
    import flash.net.URLLoader; 
    import flash.net.URLLoaderDataFormat; 
    import flash.net.URLRequest; 
     
    public class InvertRGB extends Sprite 
    { 
        private var shader:Shader; 
        private var loader:URLLoader; 
         
        public function InvertRGB() 
        { 
            init(); 
        } 
         
        private function init():void 
        { 
            loader = new URLLoader(); 
            loader.dataFormat = URLLoaderDataFormat.BINARY; 
            loader.addEventListener(Event.COMPLETE, onLoadComplete); 
            loader.load(new URLRequest("invertRGB.pbj")); 
        } 
         
         
        private function onLoadComplete(event:Event):void 
        { 
            shader = new Shader(loader.data); 
             
            var target:Shape = new Shape(); 
            addChild(target); 
             
            var g:Graphics = target.graphics; 
            var c:Array = [0x990000, 0x445500, 0x007799]; 
            var a:Array = [255, 255, 255]; 
            var r:Array = [0, 127, 255]; 
            var m:Matrix = new Matrix(); 
            m.createGradientBox(w, h); 
            g.beginGradientFill(GradientType.LINEAR, c, a, r, m); 
            g.drawRect(10, 10, w, h); 
            g.endFill(); 
             
            var invertFilter:ShaderFilter = new ShaderFilter(shader); 
            target.filters = [invertFilter]; 
        } 
    } 
}

Pour plus d’informations sur l’application de filtres, voir Création et application de filtres .

Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.