Flex图像编程技巧 3：图像滤镜

txf2004

浏览: 7041661 次
性别:
来自: 上海

最近访客更多访客>>

east_java

u012363178

wangyy

GDGZWQZ

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

编程 Flex Flash Adobe 工作

Flex图像编程技巧 3：图像滤镜

Andrew Trice

这是Andrew图像编程系列的第三篇，当然这些技巧不仅适用于FLEX，他们同样也适用于FLASH，本篇主要关注的是如何在图像处理的过程中恰当的运用滤镜

图像滤镜使得编程人员能够对任意的显示对象进行像素级别的操作及变换，因此任何能够在FLEX中显示的对象都可以运用滤镜来进行诸如：模糊，发光，阴影甚至是颜色处理，锐化，边界检测。听起来似乎很玄，但是其实上手十分容易，在这篇帖子中我将从FLEX的几个简单的特性入手，如：模糊，阴影，发光以及颜色变换等等。也许在后续的一些贴子中我会展示一些更加高深的技术如：置换滤镜，羽化等等

All of these examples begin with the same gear image that we've used in the previous two examples:这里用到的例子还是我们在前面的例子中使用的齿轮

可以使用AS3或者是MXML标签来应用滤镜，这里的例子主要是透过AS3代码来交代如何使用滤镜

首先，让我们来看一下模糊滤镜。这个滤镜非常简单，首先你要决定图像在X,Y两个方向的模糊度，当然还有量，量属性决定了在图像进行模糊渲染的时候所要进行的迭代计算次数，因此越高的质量，迭代的次数就越多，占用的CPU资源当然也就越大。当然你不需要设置所有的属性，因为这些属性都有缺省值，这里所有的例子都展示了如何设置滤镜的参数，以及对应的效果。

var filter : BlurFilter = new BlurFilter();

filter.blurX = blurX.value;

filter.blurY = blurY.value;

filter.quality = quality.value;

image.filters = [ filter ]

另一个简单的以及我非常喜爱的滤镜就是阴影滤镜，使用这个类你可以为任何东西添加阴影。简单易用，功能强大。

var filter : DropShadowFilter = new DropShadowFilter();

filter.blurX = blurX.value;

filter.blurY = blurY.value;

filter.quality = quality.value;

filter.alpha = _alpha.value;

filter.angle = angle.value;

filter.color = color.selectedColor;

filter.distance = distance.value;

filter.inner = inner.selected;

image.filters = [ filter ];

这儿还有一些拉伸和发光的例子，代码和上面的基本一致，我就不贴出来了，你只需要创建一个滤镜的实例，然后将对象的滤镜数组添加相应的滤镜

使用ColorMatrixFilter，你同样也可以加强或者改变你图像的颜色（也包括其他的所有显示对象），本例中仅适用此技术来改变现实对象的像素的颜色，当然你也可以使用该技术来添加或者去除显示颜色，增加艾对比度。这是图像处理的非常强大的工具

var filter : ColorMatrixFilter = new ColorMatrixFilter();

var matrix:Array = new Array();

matrix = matrix.concat([r.value, 0, 0, 0, 0]); // red

matrix = matrix.concat([0, g.value, 0, 0, 0]); // green

matrix = matrix.concat([0, 0, b.value, 0, 0]); // blue

matrix = matrix.concat([0, 0, 0, _alpha.value, 0]); // alpha

filter.matrix = matrix;

image.filters = [ filter ];

当你把这些滤镜组合起来使用的时候，你就能够体会到滤镜的强大之处了，正如上面所提到的滤镜可以作为滤镜数组参数的一部分应用到一定的对象，可以使用的滤镜的数量是没有明确的限制的，当然你要记住，你使用的滤镜越多，你耗费的CPU时间就越多，下面是如何将这些滤镜组合起来的一个例子

var b : BlurFilter = new BlurFilter();

var d : DropShadowFilter = new DropShadowFilter( 15 );

var g : GlowFilter = new GlowFilter( 0xFF0000, 1, 5, 5, 2, 1, true );

image.filters = [ b, d, g ]

... and here is the output: