FLASH8 Tile page Background-flash tile image

Web page | background

Previously written in the flashmx2004 to tile the background of the method, although it is also effective, but the relative use of flash8 is still somewhat complicated. This is a new method of MovieClip in Flash8 Movieclip.beginbitmapfill () Method. Using this method to tile the background is very simple. Here we go.

Demo File:

1. We need to prepare a small picture first. Currently we are using a small GIF image as shown in the following illustration:

If you want to test you can download some images directly to test.

2. Create a new flash document, size at will, import the image we selected into the library, and set the link directly in the library for this image. Currently we are set to Pattern1, the basic method is to select the image in the library just imported, right click to select the link, as shown in the following figure:

3. After completing this step, press down we are ready to use the code to tile the background. We mentioned earlier that we would use the Moiveclip.beginbitmapfill () method. Let's look at the Beginbitmapfill () method first:
Public Beginbitmapfill (Bmp:bitmapdata, [Matrix:matrix], [Repeat:boolean], [Smoothing:boolean]): Void
Beginbitmapfill method is to add a bitmap to fill the painting area, which means that it needs to have a painting area, it has four parameters, BMP parameters can be a transparent or not through the image, matrix parameters are mainly used to transform the operation of BMP, including rotation, scaling and moving, The next two parameters repeat is whether to set the duplicate, the smoothing parameter is the design is smooth, the default is not smooth. For Beginbitmapfill () the most basic application is that you can use only BMP parameters. Ok, we're going to encode the following.
4. Select the first frame in the scene and add the following code:

Import Flash8 BitmapData class
Import Flash.display.BitmapData;
Create the BitmapData instance, where the Flash8 LoadBitmap is used. If not clear can//See the Flash8 bitmapdata tutorials of this site
var tile:bitmapdata = Bitmapdata.loadbitmap ("Pattern1");
Use the Beginbitmapfill () method to start filling.
This.beginbitmapfill (tile);
The following paragraph is based on the size of the screen to draw the painting area, to Beginbitmapfill to fill.
This.lineto (stage.width, 0);
This.lineto (Stage.width, stage.height);
This.lineto (0, stage.height);
This.lineto (0, 0);
This.endfill ();

5. Test your movie now and you can see the effect as shown in the following figure.

6. Oh, it does look very simple, just a few lines of code, as opposed to the flashmx2004 tile effect, now you're not in the need to calculate the screen of the wide energy to accommodate how many small picture. Ok. Now click on the upper right corner of the window to enlarge the button, we found that only the center area is filling, not around, That means it doesn't redraw as the screen changes, which is not what we want, and for the background, it needs to change as the size of the screen changes. Next we continue to add the code.
7. To make it smaller than the size of the screen, we need to work with the stage class in Flash8. The following code:

Stage.scalemode = "Noscale";
Stage.align = "TL";
var stagelistener:object = new Object ();
Stagelistener.onresize = function () {
Trace ("W:" +stage.width+ ", H:" +stage.height);
TILEBG ();
};
Stage.addlistener (Stagelistener);
Call the TILEBG () function to draw the first time
TILEBG ();

*******************************************
Import Flash.display.BitmapData;
function Tilebg () {
var tile:bitmapdata = Bitmapdata.loadbitmap ("Pattern1");
This.beginbitmapfill (tile);
This.lineto (stage.width, 0);
This.lineto (Stage.width, stage.height);
This.lineto (0, stage.height);
This.lineto (0, 0);
This.endfill ();
}

We've added a stage size change on top of our original code, this paragraph should be said to be my very common code, for the sake of convenience, we define the original code as a function that is TILEBG (), so that when the screen size changes, the OnResize () method is executed, The defined TILEBG () function is invoked. OK. Now in the test of your video, the problem has been solved, you can click on the SWF window to enlarge the button to see the effect

8. Next, we'll delve into some of the other parameters of Beginbitmapfill. Let's say we want the effect of the tile to always be smooth. Then we set the smoothing always true; Let's look at the matrix and repeat two parameters. Select the first frame and open the ActionScript panel. We make the following simple changes.

function Tilebg () {
var tile:bitmapdata = Bitmapdata.loadbitmap ("Pattern1");
var matrix = new Flash.geom.Matrix ();
repeat = false;
Smoothing = true;
This.beginbitmapfill (tile,matrix,repeat,smoothing);
This.lineto (stage.width, 0);
This.lineto (Stage.width, stage.height);
This.lineto (0, stage.height);
This.lineto (0, 0);
This.endfill ();
}

We just need to make a little change in the TILEBG () function to define the matrix, repeat, and smoothing three parameters, and one more thing to remember, This.beginbitmapfill (Tile,matrix,repeat, Smoothing) Add the other three parameters. The default state is repeat to true; we can now see the effect.

It also looks like a good effect. Of course it will still change with the size of the screen, and then we'll see matrix transformation matrices in Matirx,flash8 are relatively complex. But Flash8 offers a few simple ways of matrix, such as rotation, scaling, displacement, and so on, here we demonstrate the rotation.

9. Modify the above TILEBG () function again. Add matrix transform. as follows:

function Tilebg () {
var tile:bitmapdata = Bitmapdata.loadbitmap ("Pattern1");
var matrix = new Flash.geom.Matrix ();
Matrix.rotate (MATH.PI/4);
repeat = false;
Smoothing = true;
This.beginbitmapfill (tile,matrix,repeat,smoothing);
This.lineto (stage.width, 0);
This.lineto (Stage.width, stage.height);
This.lineto (0, stage.height);
This.lineto (0, 0);
This.endfill ();
}

We have added a line of matrix.rotate (MATH.PI/4) that rotates 45 degrees.
The test effect looks like this:
Demo File

If you are interested in other methods of the matrix, you can continue to try. You can customize it according to your needs. Ok.