Flash image processing effect filter pixelbender blender Mode

Turn left and turn right. Zoom in and zoom out. You can write it on your own, or use existing libraries on the Internet to assist in such basic operations, such as transformtool.

The real Flash image effect is of course some advanced products, such as black and white, and LoMo... 1. Various filter classes

• bevelfilter

  Users can create text or images with stereoscopic effects.

• blurfilter

  blur text or images

• projection filter (dropshadowfilter class)

  Add shadow effect

• Glow filter

  Add Glow filter

• gradient oblique filter (gradientbevelfilter class)

  corner effects can be achieved by gradient of multiple colors

• gradient light filter (gradientglowfilter)

  luminous effect can be achieved using multiple color variations

• color matrix filter (colormatrixfilter)

  you can set the brightness, contrast, saturation, and color of an image!

• convolutionfilter)

  sharpen, edges, and engrave images!

• placement filter (displacementmapfilter class)

  you can switch between two images!

• shaderfilter)

  you can apply different PBJ files to achieve multiple effects! For example, focusing on Blur, pencil drawing, reversed color, Mosaic, and color effect!

The first six gadgets correspond to several effects of the Flash CS filter panel. They are easy to use. For details, refer to this:   Http://blog.sina.com.cn/s/blog_3fbce8b10100o8oz.html. The color matrix filter at the back is much more powerful than the filter at the shadow. The color matrix filter is detailed below. 2 color matrix filter colormatrixfilter The filters above will make some extra display around or inside the component. If you want to modify only the color of the image itself, such as black and white, you still need colormatrixfilter. Reference   Http://blog.csdn.net/flag_and_leg/article/details/6412945 http://blog.sina.com.cn/s/blog_49b35d540100aks4.html colormatrixfilter is to adjust the color value of each point in the image, including alpha value. Colormatrixfilter is easy to use, but it is very elegant if you set every value in it. For example, in the above reference website, it is very simple to make an image Black and White (grayscale:

• // Load a color image
• VaR image: bitmap = new Bitmap ();
• Image = Bitmap (loader. content );
• // Define the filter matrix, an array containing 20 items
• VaR matrix: array = [0.3086, 0.6094, 0.0820, 0, 0,
• 0.3086, 0.6094, 0.0820, 0, 0,
• 0.3086, 0.6094, 0.0820, 0, 0,
• 0, 0, 0, 1, 0];
• // Initialize a colormatrixfilter object (matrix as a parameter)
• VaR myfilter: colormatrixfilter = new colormatrixfilter (matrix );
• // Apply the filter to the image
• Image. Filters = [myfilter];

You can try to adjust each number of the matrix manually here: http://d2fhka9tf2vaj2.cloudfront.net/tuts/070_effectsTester/Preview/EffectsTester.html In addition, some people have sorted out some of the more commonly used basic photo processing colormatrixfilter Code (Contrast, saturation, brightness or something): http://code.google.com/p/ghostcat/source/browse/trunk/GhostCat/src/ghostcat/filter/ColorMatrixFilterProxy.as? Spec = svn596 & R = 476 use this code to test the brightness, contrast, and inversion respectively: as to why we did this, some people also said a bit of analysis: http://cjdyx815.blog.163.com/blog/static/187705056201172322035148/ but since these are easy to find, so here is not detailed to expand said. In addition to the above basic photo processing functions, can colormatrixfilter be used to make a more practical filter effect? The answer is yes. For example, black and white are the same as those mentioned above. Black and white: [0.3086, 0.6094, 0.0820, 0, 0, 0.3086, 0.6094, 0.0820, 0, 0, 0.3086, 0.6094, 0.0820, 0, 0, 0, 0, 0, 1, 0] Old photos: (why is this computation so difficult) [0.3930000066757202, 0.7689999938011169, 0.1889999955892563, 0, 0, 0.3490000069141388, 0.6859999895095825, 0.1679999977350235, 0, 0, 0.2720000147819519, 0.5339999794960022, 0.1309999972581863, 0, 0, 0, 0, 0, 1, 0] 3. more primitive operations: getpixel Through getpixel of bitmapdata, we can obtain the color value of each pixel, and then we can separate the colors of each channel, namely, red, green, and blue, you can also add the values of red, green, and blue to the merged RGB values. Method: Private   Static   Function   Mergergb (RED: uint, Green: uint, Blue: uint): uint {   Return   Red <16 | green <8 | blue; }   Private   Static   Function   Getred (color: uint): uint {   Return   (Color> 16) & 0xff; }   Private   Static   Function   Getgreen (color: uint): uint {   Return   (Color> 8) & 0xff; }   Private   Static   Function   Getblue (color: uint): uint {   Return   Color & 0xff; } So what is the purpose of separation? Separating the color values of each channel is of course useless... However, through a variety of images Algorithm Modify and overlay the color values of each channel, and use setpixel to restore the data to obtain a new bitmapdata image. However, this merge algorithm is of course relatively complicated. However, we can still google some sporadic examples. For example, the following figure shows the LoMo effect: the results of the above four figures are the results of several steps. For details, refer:   Http://bbs.9ria.com/thread-83906-1-1.html

• Filter color. Produce bleaching effect; as the basemap of step 3
• Reverse. As the foreground diagram of step 3
• The blue tunnel 20% of the foreground chart overwrites the final diagram. (Overlay color r = overlay color R * overlay Alpha + background color R * (1-overlay color alpha ))

4. advanced and efficient pixelbender In fact, pixelbender, in my understanding, is the advanced version of getpixel. According to the official introduction, we can only calculate getpixel one by one, but pixelbender is independent. Program Can be calculated in batches. Brief Introduction:   Http://www.pixelbender.cn /? P = 130   What is a pixel shader? Simply put, it is a program used to calculate pixel values. It seems to be too simple, but this is the basic task for pixel shader. All the pixel shader types are composed of input and complex calculation algorithms. In the end, it will only tell you: "This pixel should be the value ."   There are many reasons why Pixel Bender is a normal project and why people are excited about it. First, Pixel Bender can be applied to bitmaps, fills, and other visual objects, and then runs pixel shader on each pixel. Not one by one, but once. Yes, it calculates all the pixel values in a region at the same time. It is compiled and optimized and runs in an independent process, which is independent of Flash Player. All in all, compared with the graphic processing in flash, pixel shader's execution efficiency is very fast. You can understand pixelbender in a few steps:

• Open pixelbender toolkit, open the image, load a filter, and check the code to see the effect. The result is the code that runs .. Input several images, and then evalutepixel calculates the value of each pixel.
• Learn Basic Data Types and syntaxes. Learn how to write simple programs in toolkit. Http://www.pixelbender.cn /? P = 154
• • Image4, pixel4, and float4 all have four channels, which are a struct. The value of each channel in pixel4 is in the range of 0 to 1. to convert it to 255, multiply it by 255.
  • Float3 * float3, which is special when two vectors are multiplied. Here, instead of matrix multiplication, the first element is multiplied by the first element, and the second element is multiplied by the second element ..
  • All constant numbers are written as decimal places and are forcibly float. Otherwise, an error occurs in the float operation.
  • Array arrays cannot be used in Pixel Bender code loaded by Flash Player. The clever way is to use a bitmapdata with a width of array. length and a height of 1, and then use samplenearest (SRC, float2 (x, y) to retrieve
• Understand basic functions. Outcoord () gets the current pixel coordinate, samplenearest (). It requires two parameters, the first is the image, and the second is the float2 variable containing the X and Y coordinate values. It finds the pixel closest to the float2 variable and returns the pixel value.
• Add parameters. This is easy to use in toolkit, and the corresponding control bar is automatically generated.
• Basic Control: If Else. No for while or something
• How to use it in. It can be used purely as a tool or as a filter, fill, or mixed mode.
• • Export the PBJ file;
  • Load/embed PBJ. Load: var shader: shader = new shader (loader. Data ). Embedded: [embed (Source = "pixelate. PBJ", mimetype = "application/octet-stream")]
  • • If the new shader keeps prompting the #2004 error, try to delete some PB code, probably because some built-in functions are not supported in flash. For example, normalize. Be sure to use flash mode test in Toolkit
  • Purely used as a tool. Shaderjob, which is used to pass in the shader and the target (for example, the new bitmapdata) stored in the result store, and can process data asynchronously or synchronously.
  • Used for filling: graphics. beginshaderfill (shader );
  • Filter: VaR Filter: shaderfilter =New Shaderfilter (shader); then assign a value to the filters attribute of the component. This component is automatically used as the first image4 input.
  • Used in hybrid mode. Http://www.pixelbender.cn /? P = 73.
    • Foregroundshape. blendshader = shader;
      Foregroundshape. blendmode = blendmode. shader;
    • When you use a shader as the blending mode, it must be defined by at least two inputs. If this parameter is not specified manually, the two mixed images are automatically used as the inputs for the coloring tool. The foreground image is set to the second image. (This display object is the object to apply the blending mode to it .) The background image is composed of all pixels after the foreground image border. Set the background image to the first input image. If more than two inputs are required for the color filter, a value must be provided for the first two inputs.
  • Set parameters: shader. Data. xres. value = [20]. xres is the parameter set in Pb Code and is assigned as an array.
  • Input Image: shader. Data. SRC. Input = image. bitmapdata; Pb code: Input image4 SRC

Efficiency Comparison This comparison uses a filter (photo show filter-Rainbow) mixed with three template images as a test:

	Getpixel computing	Pixelbender
Big image (2592*1936)	31 seconds	480 Ms
Thumbnail (402*402)	1.2 seconds	120 ms

We can see that efficiency is a world of difference .. However, in this translation (change the getpixel filter to the pixelbender filter), the unit conversion here is because the RGB representation is 0 to 255 and 0 to 1, respectively, will make the results inconsistent. At present, we still cannot restore the original effect. The conversion between 0-255 and (0-1) is relatively simple, that is, multiply or divide by 255. It is because the difference is often caused by 256 divisor in the getpixel filter. 5. Further Image Processing When we get to the getpixel and pixelbender layers mentioned above, we will find that we are getting increasingly confused about why some filters need to be multiplied and subtracted. Is there any reason? If you need to understand this, you need to start with the basic knowledge of the image. For example, what is RGB and what is saturation. However, if several images are used for merging, you need to understand the blend mode. That is, multiply and add something. Click here:   Http://en.wikipedia.org/wiki/Blend_modes can also be associated with the post-processing curve of photography photos, understand. The common ones are multiply and screen, which respectively make the image darker and brighter.