L'uso di uno shader come filtro è analogo all'uso di tutti gli altri filtri in ActionScript. Quando utilizzate uno shader come filtro, l'immagine filtrata (un oggetto di visualizzazione o un oggetto BitmapData) viene passata allo shader. Lo shader utilizza l'immagine di input per creare l'output del filtro che in genere è una versione modificata dell'immagine originale. Se l'oggetto filtrato è un oggetto di visualizzazione, l'output dello shader viene visualizzato sullo schermo al posto dell'oggetto di visualizzazione filtrato. Se l'oggetto filtrato è un oggetto BitmapData, l'output dello shader diventa il contenuto dell'oggetto BitmapData di cui viene chiamato il metodo
applyFilter()
.
Per usare uno shader come filtro, dovete in primo luogo creare l'oggetto Shader come descritto in
Caricamento o incorporamento di uno shader
. In seguito, create un oggetto ShaderFilter collegato all'oggetto Shader. L'oggetto ShaderFilter è il filtro che viene applicato all'oggetto filtrato. Lo applicate a un oggetto analogamente a quanto avviene con i filtri, passandolo alla proprietà
filters
di un oggetto di visualizzazione o chiamando il metodo
applyFilter()
su un oggetto BitmapData. Il codice seguente ad esempio crea un oggetto ShaderFilter e applica il filtro per visualizzare un oggetto denominato
homeButton
.
var myFilter:ShaderFilter = new ShaderFilter(myShader);
homeButton.filters = [myFilter];
Quando utilizzate uno shader come filtro, lo shader deve essere definito con almeno un input. Come mostra l'esempio, non dovete impostare il valore di input nel codice, ma come immagine di input viene impostato l'oggetto di visualizzazione filtrato o l'oggetto BitmapData. Se usate uno shader che prevede più di un input, dovete fornire il valore degli input successivi al primo.
In alcuni casi, un filtro cambia le dimensioni dell'immagine originale. Un tipico effetto ombra esterna, ad esempio, aggiunge pixel extra contenenti l'ombra che viene aggiunta all'immagine. Quando utilizzate uno shader che cambia le dimensioni dell'immagine, impostate le proprietà
leftExtension
,
rightExtension
,
topExtension
e
bottomExtension
per indicare di quanto desiderate che vengano modificate le dimensioni dell'immagine.
L'esempio seguente dimostra l'uso di uno shader come filtro. Il filtro in questo esempio inverte i valori dei canali rosso, verde e blu di un'immagine. Il risultato è la versione “negativa” dell'immagine.
Nota:
lo shader utilizzato in questo esempio è il kernel Pixel Bender invertRGB.pbk, incluso in Pixel Bender Toolkit. Potete caricare il codice sorgente del kernel dalla directory di installazione di Pixel Bender Toolkit. Compilate il codice sorgente e salvate il file del codice byte nella stessa directory del codice sorgente.
Il codice ActionScript importante è presente in questi due metodi:
-
init()
: il metodo
init()
viene chiamato quando viene caricata l'applicazione. In questo metodo il codice carica il file di codice byte dello shader.
-
onLoadComplete()
: nel metodo
onLoadComplete()
il codice crea l'oggetto Shader denominato
shader
e crea e disegna il contenuto di un oggetto denominato
target
. L'oggetto
target
è un rettangolo con un riempimento a gradiente lineare rosso a sinistra, giallo/verde al centro e azzurro a destra. L'oggetto non filtrato ha il seguente aspetto:
Applicando il filtro, i colori vengono invertiti e il rettangolo ha il seguente aspetto:
Lo shader utilizzato in questo esempio è il kernel Pixel Bender invertRGB.pbk, incluso in Pixel Bender Toolkit. Il codice sorgente è disponibile nel file invertRGB.pbk nella directory di installazione di Pixel Bender Toolkit. Compilate il codice sorgente e salvate il file del codice byte denominato invertRGB.pbj nella stessa directory del codice sorgente ActionScript.
Viene di seguito riportato il codice ActionScript per questo esempio. Utilizzate questa classe come classe di applicazione principale per un progetto costituito solo da ActionScript in Flash Builder o come classe di documento per il file FLA in 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];
}
}
}
Per ulteriori informazioni su come applicare filtri, vedete
Creazione e applicazione di filtri
.