The Pixel Bender 介绍

Adobe Pixel Bender Toolkit 是在CS4 中新加的东西，其实之前安装CS4的时候有注意到它的存在，只是今天才意识到它的强大，特地发贴详细介绍一翻。

照例先看Demo，点击上面的图片可以看到一个马赛克效果，在flash中要实现一个马赛克效果并不是什么夸张的事，夸张的是在如此大范围的图像上流畅的计算出马赛克效果。之前如果做过flash马赛克效果的人应该都知道，这些是纯as办不到的事情，但是这个swf做到了，那么现在能隐约感觉出Pixel Bender 的强大吗？其实真正厉害的还远不止这些，下面慢慢介绍。

以刚才那个Demo为例子，将代码贴在下面

package {
	import flash.display.Shader;
	import flash.display.Sprite;
	import flash.display.StageAlign;
	import flash.display.StageScaleMode;
	import flash.filters.ShaderFilter;

	[SWF(backgroundColor=0x000000)]
	public class ShaderAsFilter extends Sprite {
		[Embed(source="pixelate.pbj",mimeType="application/octet-stream")]
		private var ShaderClass:Class;
		public var shader:Shader;
		public var dir:int = 1;

		public function ShaderAsFilter() {
			stage.align=StageAlign.TOP_LEFT;
			stage.scaleMode=StageScaleMode.NO_SCALE;
			stage.addEventListener("resize",resizeHandle);

			bmp.width=stage.stageWidth;
			bmp.height = stage.stageHeight;

			shader = new Shader(new ShaderClass());
			addEventListener("enterFrame",enterFrameHandle);
		}
		public function render(num){
			shader.data.dimension.value[0] = num;
			bmp.filters=[new ShaderFilter(shader)];
		}
		public function enterFrameHandle(e) {
			var tmp=shader.data.dimension.value[0];
			if (tmp>60) {
				dir=-1;
			}
			if (tmp<2) {
				dir=1;
			}
			tmp += dir
			render(tmp)
		}
		public function resizeHandle(e) {
			bmp.width=stage.stageWidth;
			bmp.height=stage.stageHeight;
		}
	}
}

恩，新东西 pixelate.pbj 是什么？.pbj 的全称是 Pixel Bender Byte Code files，是Pixel Bender Kernel files 为flash player导出的文件。所以这里就涉及到刚才提到的Adobe Pixel Bender Toolkit 的使用。打开Pixel Bender Toolkit，把下面代码贴进去，然后选择 File => Export Kernel File for Flash Player 为flash导出一个pbj文件。另外，Pixel Bender Toolkit的导出路径是不能包含中文的，假设你把pbj导出保存在桌面上，你是找不到这个pbj的，而且也不会报错，这可能是个bug，需要注意下。

< languageVersion: 1.0; >

kernel pixelate
<   namespace : "AIF";
    vendor : "Adobe Systems";
    version : 2;
    description : "pixelate an image"; >
{
    parameter int dimension
    < minValue: 1;
      maxValue: 100;
      defaultValue: 1; >;

    input image4 inputImage;
    output pixel4 outputPixel;

    void
    evaluatePixel()
    {
        float dimAsFloat = float(dimension);

        float2 sc = floor(outCoord() / float2(dimAsFloat, dimAsFloat));
        sc *= dimAsFloat;

        outputPixel = sampleNearest(inputImage, sc);
    }
}

然后你就可以在flash中使用这个pbj滤镜。看来你使用了一个flash原本不带的滤镜效果，这么说你也可以下载到别人的pbj滤镜使用到自己的flash里？没错，而且他们的运行效率非常高。
adobe提供了这样一个地址，有兴趣的朋友的可以去看看。
http://www.adobe.com/go/pixelbender

有点一头雾水？没关系，下面有个网站，对Pixel Bender的应用做了详细介绍。
http://www.pixelbender.cn/?p=130

引用书中原文的话：
“ 有很多原因说明为什么Pixel Bender是一项牛B项目、为什么人们都为它感到兴奋。
首先，Pixel Bender可以应用于位图、填充以及其它可视对象，然后运行pixel shader作用在每一个像素。不是逐个逐个，而是一次过。没错，它是在同一时间计算一个区域内的所有像素值。它编译后得到优化并且运行在独立的进程，是独立于Flash Player的。总而言之，相对于Flash里的图形处理，pixel shader的执行效率是非常快的。

不过Pixel Bender shader有一个缺点，就是它必须在外部使用Pixel Bender Toolkit来编写并且使用基于C的Pixel Bender语言。在使用它之前必须编译、保存、加载或绑定到你的Flash文件里。工作量不少，而且又要学C语言。不过不用担心，对于聪明的你来说这都是很简单的。

在Flash里，使用Pixel Bender shader可以实现以下四点：

1. 自定义滤镜：就像使用投影、模糊那些滤镜一样，你现在可以把ShaderFilter应用到任何显示对象了。ShaderFilter是依赖着你在Pixel Bender Toolkit写的shader。

2. 填充：在绘图API（Application Programming Interface）里，你填充图形时总是用纯色、渐变色或位图。现在你可以用beginShaderFill方法填充一个Pixel Bender shader了。

3. 混合模式：一个pixel shader可以用作混合模式，它将影响显示对象的层叠显示方式。要使用它，将Shader对象指派给前景显示对象的 blendShader 属性。

4. “Generic number crunching”：使用shader可以处理一组数据（包含复杂的数学运算），功能强、速度快。跟平常使用的shader不同，你传递二进制数据进去，用指定的算法处理这些数据，然后返回处理后的二进制数据。你所需要做的事情就是像传入图片一样传入二进制数据。”