Date: 2007-06-24
Hits: 10097
Rate:
email to friends
printFlash Background Pattern discussion
This is part of flash pattern background tutorial, so if you haven't read how to make the pattern background in Flash 8 tutorial, do read it first before continue with the following discussion.
The first line duplicateMovieClip(patt0, "patt"+i, i) tells the flash player to duplicate the motif and to assign the clone the instance name of “patt”+i. The first instance will be patt1, then patt2 so on so forth…
The other two lines
this["patt"+i]._x = this["patt"+(i-1)]._x+patt0._width;
this["patt"+i]._y = this["patt"+(i-1)]._y;
these tell the player to place each new instance next to the previous one.
But what if we reached the left edge of the stage? We should move down and start over. That’s exactly what the if statement does :
if (this["patt"+i]._x>Stage.width) {
this["patt"+i]._y = this["patt"+(i-1)]._y+patt0._height;
this["patt"+i]._x = 0;
}
Basically we’re checking whether the current instance _x position exceed the right edge of the stage and if so, we’re telling flash player to place the next instance below the previous ones at _x =0.
Finally, our counter (i) is incremented by one.
i++;
As for the condition to stop this cycle, well it is self explanatory:
while (this["patt"+(i-1)]._y<Stage.height);
so the duplication will stop when the current instance is below the lower edge of the stage, which is exactly what we want.
And that’s about it.
Now, how could we do the same tiling thing at design time you ask?
Well, it’s easy too. After drawing the motif, export it as image (minimum image area) and then re-import that image to the stage, select it and break it apart (ctrl+b) then simply resize the image to fill the stage by clicking its corners and dragging them to the stage corners as shown in the picture below:
That’s it.
I Hope you enjoyed this tutorial.
Go back to flash pattern tutorial now.
