A concise example of Flash8 water wave production-a probe

has been one, Flash8 water wave production is more let me yearning, online also out a lot of textbooks, flash the master hbb and Xiankevin have been related to the tutorial, but I did not have time to learn, see the source file is a mess, in the end is today to see, tomorrow forget. These days learn flash new class, finally learned the Displacementmapfilter filter class, all enlightened, the original water wave production so simple, the following is yesterday to learn, today do a small example. Very simple, basically three steps to complete a water wave production prototype. Try the Bitmapdata.perlinnoise method again tomorrow to deepen the impression. Note: Xiankevin's classic textbook has a collection in my blog post column.

First look at the effect:

Click here to download the source file

If you don't see it, there's also a link at the bottom and a source file.

First we need to find a background (the same size and scene), or hand-painted one, here I use the blog icon. You can also use a picture as a MC to replace. After doing this, drag the MC into the scene, align the center, and give it an instance named pic

The second step is to create a new MC, draw a black and white color of the radioactive gradient circle, and make it dynamic effect, look here:

This will move the radioactive gradient MC, we add to it in the library identifier (called Ball good), you can not do so, the following explanation has a choice of room

The third step is to create a new MC, which draws a rectangle with the same size as the scene (note that the rectangle should be aligned with the MC's Scene Center "on the Left") as shown below, this rectangle is the area in the future where the pic effect is to be done, and if you don't draw the rectangle, the future will feel like there's an edge. , the visual is relatively false, of course, if you have a heart, there are other ways to solve this problem.

Next, if you just lazy name identifier, you can create a new layer in this MC, the just that radioactive gradient of the MC (moving that) dragged in, the position is placed in the middle of this rectangle.

If you name the identifier, you can add the following code directly to the frame:

var depth:number = this.getnexthighestdepth ();
FILE://gets the available level, returns a number
This.attachmovie ("Ball", "ball" +depth, depth);
file://The radioactive gradient animation in the load library.
this["Ball" +depth]._x = STAGE.WIDTH/2;
file://determine the location. What is the specific parameter, look at your height preferences.
this["Ball" +depth]._y = STAGE.HEIGHT/2;
Finally, back to the main scene, when the main scene already has the original production of the instance named pic Background (off of the blog); now just make the included rectangular MC dragged in, put it far away from the side can be, the following is the home scene frame code:
File://by Guan
file://prevents animation scaling.
Stage.scalemode = "Noscale";
FILE://Import related classes, rote three import below.
Import flash.display.*;
Import flash.filters.*;
Import flash.geom.*;
FILE://creates a BitmapData object that is the same size as the MC of the radioactive gradient
var bit:bitmapdata = (New BitmapData (Mask._width, Mask._height, true));
FILE://ZJX and Zjy are the channels used to render animations, values 1, 2, 4, 8, corresponding to red, green, blue, and alpha channels. I think the basics can be memorized.
var zjx:number = 1;
var zjy:number = 2;
FILE://SFX, sfy These two data can change the intensity of the water wave, that is, the degree of distortion of the image on the x-axis and the Y axis.
var sfx:number = 10;
var sfy:number = 20;
file://by frame, you can also use setinterval to achieve, because the radioactive gradient is dynamic, and bitmap object to imitate it, you must do dynamic tracking.
This.onenterframe = function () {
The file://adds a radioactive gradient animation to the bit to draw it out.
Bit.draw (mask);
file://sets a displacementmapfilter filter object, which has the function of distorting the image, where the ZJX, ZJY, and other variables are used.
var filter:displacementmapfilter = (new Displacementmapfilter (bit, new Point (), ZJX, ZJY, SFX, sfy, "color", 0, 0));
file://a component in the scene named Pic uses the newly created filter because the onenterframe is used, so the effect is dynamic drop:)
Pic.filters = [filter];
};

The ctrl+enter can be tested.

Finally summed up:

1. Must have a dynamic dongdong to do the appearance of fluctuation, Bitmapdata.perlinnoise class is a deeper fluctuation, tomorrow again test.

2. There is a BitmapData object constantly to the fluctuation of the MC to draw.

3. The need for fluctuations in the image using Displacementmapfilter filter class, the source is the BitmapData object to draw the wave effect.