Categories
AS3 AS3 migration Flash

Tiled background AS3

Sometimes you just need a pattern in the background that is fullscreen, of course you can use a big .PNG file but that is not always necessary.
You can use a pattern that you need to tile, I’ve written about this before: my post about tiled-background in Flash 8 AS2.
The code over there is based upon a tutorial (http://www.kirupa.com/developer/flash8/tiledbackground_flash8.htm)

And because kirupa is great they already have the answer:http://www.kirupa.com/forum/showthread.php?t=265953

But to put it next to each other:

AS2 example

For this example you need a bitmap in the library (right-click >> Linkage… >> activate ‘Export for ActionScript’) with the Linkage IndentifierStripePattern_mc‘ and this AS2 code placed in the root
[as]
import flash.display.BitmapData;
var backGroundBMP:BitmapData = BitmapData.loadBitmap(“StripePattern_mc”);
this.beginBitmapFill(backGroundBMP);
this.lineTo(Stage.width, 0);
this.lineTo(Stage.width, Stage.height);
this.lineTo(0, Stage.height);
this.lineTo(0, 0);
this.endFill();
[/as]

AS3 example

But in AS3 some things have changed. And for consistency I’m using StripePattern_mc although coding conventions will say it has to be StripePattern
[as]
var backGroundSprite:Sprite = new Sprite();
backGroundSprite.graphics.beginBitmapFill(new StripePattern_mc(0, 0));
backGroundSprite.graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight);
backGroundSprite.graphics.endFill();
addChild(backGroundSprite);
[/as]

Besides the obvious changes, which I’m not going to explain (Stage.width vs stage.stageWidth, etc).

code line 2
BitmapData.loadBitmap is removed from AS3. There are no longer Linkage Identifiers and there is no longer attachMovie. Everything is created using the new operator.
And because a Bitmap(Data) needs two extra variables:
public function BitmapData(width:int, height:int, transparent:Boolean = true, fillColor:uint = 0xFFFFFFFF)

code line 3
drawRect is a new Graphic methode, but is does the same as the AS2 code part with lineTo, but shorter.

code line 5
and you need to add it to the displaylist (hmmm perhaps I need to explain this in a future post)

For this example I created a pattern with stripegenerator.com/ but any pattern will do.