Flex image programming skills 3: Image Filter

You can use AS3 or MXMLAS3 code to explain how to use a filter. First, let's take a look at the fuzzy filter. This filter is very simple. First, you need to determine the Blur degree of the image in the direction of X and Y. Of course, there are still quantities, the quantity attribute determines the number of iterations to be performed when the image is blurred. Therefore, the higher the quality, the number of iterations

You can use AS3 or MXML AS3 code to explain how to use filters. First, let's take a look at the fuzzy filter. This filter is very simple. First, you need to determine the Blur degree of the image in the direction of X and Y. Of course, there are still quantities, the quantity attribute determines the number of iterations to be performed when the image is blurred. Therefore, the higher the quality, the number of iterations

You can use AS3 or MXMLAS3 code to explain how to use filters.

First, let's take a look at the fuzzy filter. This filter is very simple. First, you need to determine the Blur degree of the image in the direction of X and Y. Of course, there are still quantities, the quantity attribute determines the number of iterations to be performed when the image is blurred. Therefore, the higher the quality, the more iterations, and the larger the CPU resources occupied. Of course, you do not need to set all attributes because these attributes have default values. All examples here show how to set filter parameters and their effects.

var filter : BlurFilter = new BlurFilter();
filter.blurX = blurX.value;
filter.blurY = blurY.value;
filter.quality = quality.value;
image.filters = [ filter ]

Another simple and favorite filter is the shadow filter. You can add a shadow for anything using this class. Easy to use and powerful functions.

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 ];

Here are some examples of stretching and shining. The code is basically the same as above, so I will not post it. You only need to create an example of a filter, then add the corresponding filter to the filter array of the object.

>

Using ColorMatrixFilter, you can also enhance or change the color of your image (including all other display objects). This example only applies this technology to change the pixel color of a real object, of course, you can also use this technology to add or remove the display color and increase the AI contrast. This is a very powerful tool for image processing.

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 ];

When you combine these filters, you can see the power of the filter, as mentioned above, filters can be applied to certain objects as part of filter array parameters. There is no definite limit on the number of filters that can be used. Remember, the more filters you use, the more CPU time you spend. The following is an example of how to combine these filters.

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:

You can get all the previous tutorials from the URL below

Http://www.cynergysystems.com/blogs/blogs/andrew.trice/filters/filters.html

You can obtain all the source code of the tutorial from the URL below.

Http://www.cynergysystems.com/blogs/blogs/andrew.trice/filters/srcview/

And here:

Http://www.cynergysystems.com/blogs/blogs/andrew.trice/filters/srcview/filters.zip

As I mentioned earlier, in this post, I will not cover all filters, but I still give a lot of results that can be achieved using filters.

Bending The Rules: Curved window

Using the placement filter, we can easily complete the curved window effect.

Http://www.cynergysystems.com/blogs/page/andrewtrice? Entry = bending_the_rules

WebCam Displacement:

Detailed explanations can be obtained from the following connections

Http://www.cynergysystems.com/blogs/page/andrewtrice? Entry = displacementmapfilter_webcam_tons_o_fun

Of course, the best resource to understand the detailed working principle of filters will always be: Adobe Flex language reference.

WebCam Displacement: