PixelBenderToolKitで作ったフィルターをFlashで使うにあたって気づいたことを簡単にまとめました。

PixelBenderFilterの作り方

Adobe Pixel Bender Toolkitという、Adobeさんが出している専用ソフトで作成します。
C言語に似た、GLSLに基づく「PixelBender」という言語で書いていきますが
画像処理だけに特化しているため、非常にシンプルでとりかかりやすいです。


ToolKit上で作ったFilterをFlashで使えるようにするには
File > Export Kernel Filter for Flash Playerから書き出してpbj形式にする必要があります。

 

作るときの注意点

Flash用の書き出しの際に、ソースコードの中にループ処理やBool型のパラメータがあるとエラーが出てしまいます。
これは、FlashPlayerがカーネル内でそれらをサポートしてないためだそうです。


あと、Toolkit上で快適に動くFilterでもFlash上で使うとものすっごい遅かったりします。
体感値ですが、Toolkit上に比べて半分～１０分の１くらいな感じでした。

PixelBenderFilterの使い方

pbj形式のファイルを、Shaderクラスとして読み込み、ShaderFilterにしてあげることで、通常のfilterのように使えます。
　mc.filters = [new ShaderFilter(shader)];


また、フィルター内の各パラメータについては、下記のように設定出来ます。
　shader.data.変数名.value = [値];


 

使う時の注意点

どうやらライブラリにはpbjファイルを読み込むことが出来ない（Flash CS4）ので
メタデータタグでリンケージとして埋め込むか、Loaderで読み込んで使います。


また、ShaderFilterクラスが利用できるのはFlashPlayer10以上になります。


SpriteやMovieClipのような基準点が左上と限らないものにFilterをかけるときに、
Filter内の座標の基準となるのが、対象オブジェクトの基準点ではなく
Bounds（存在領域）の左上になるようです。

しかも、Filter対象のMovieClip内でマスクをかけてクリッピングしていても、
マスクが無い状態での一番左上の点を基準として処理してるっぽい。

そんな理由で、先日のエントリーにあげたサンプルも、
画面からはみ出した部分のアニメーションでBoundsが常に変わるので
ズームブラーの中心点を意図した場所に合わせるのがすごい大変で、
結局、対象ムービークリップは横において、フレームごとにBitmapにdrawして、
そのBitmapにフィルターをかけることで無理やり解決しましたが
もしかすると何かもっといい方法があったりするのでしょうか。


 

また何か気づいたことがあったら書き足します。