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不同，你传递二进制数据进去，用指定的算法处理这些数据，然后返回处理后的二进制数据。你所需要做的事情就是像传入图片一样传入二进制数据。”