Comments on: Simple Tiling Sprite Class in AS3

By: Dhruba

Dhruba — Thu, 17 Feb 2011 20:18:38 +0000

hi………… I just want to make a class which draw line whenever i called Line() function . Here is the code I hv written…… but it gives blank screen Please Help me………….. (It works if I directly paste the code of Line () function on Frame i.e without using class)

/*Action Frame code……..*/
new Line();

/*class script………..*/
package {

import flash.display.MovieClip;
import flash.display.Sprite;
import flash.display.*
import flash.geom.Point;
import flash.events.*;
import flash.utils.*;

public class Line extends Sprite {
public var canvas:Sprite = new Sprite();

public function Line ():void{

canvas.graphics.lineStyle(5, 0xFF0000, 1);
canvas.graphics.moveTo( 10 , 10 );
canvas.graphics.lineTo( 300 , 300 )
addChild(canvas);

}

By: Alex

Alex — Tue, 07 Dec 2010 10:35:57 +0000

If you struggling with the bg tile image appeared on top of your other movieclips add this to brndn’s class:

stageInstance.setChildIndex(child,0);

add to line 79, after

stageInstance.addChild(child);

Hope that helps.

By: Schell

Schell — Thu, 25 Feb 2010 17:10:45 +0000

The public, protected, private and internal keywords denote variable access. Here's a quick article describing each: http://greenethumb.com/article/27/public-private-protected-internal-access-modifiers-in-as

By: Miggy

Miggy — Thu, 25 Feb 2010 08:30:52 +0000

Thanks so much Schell, i will try that tonight.
by the way may i ask whats the use of “public” in ‘public var loader:Loader = new Loader();’ i know its kinda off topic and im very sorry for the dumb/noob question. I have so much to learn in AS3, it cool to learn new things.

thanks a lot!

By: Schell

Schell — Thu, 25 Feb 2010 02:14:03 +0000

> Miggy
Your problem is that my class doesn’t expose a member named ‘contentLoaderInfo’ – which is definitely a design flaw, as the class is loading an image. You could change line 54 to read ‘public var loader:Loader = new Loader();’ and then in your code use ‘BlackPattern2.loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);’ or you could just do ‘addChild(beam, 1);’ without the onComplete event. The image does not have to be loaded to add the tile to the stage.

By: Miggy

Miggy — Wed, 24 Feb 2010 12:44:26 +0000

Hi I am a newbie in action script and Im glad I found this class that really helped much. I had encountered some problems using this class, I tried to preload the background before the next image appears resulting to an error
“Access of possible undefined property contentLoaderInfo through a reference with static type com.efnx.GUI:tile.”

here is my code

stop();

import flash.display.*;
import flash.geom.Rectangle;
import flash.display.BitmapData;
import flash.display.Stage;
import flash.net.URLRequest;
import flash.display.Loader;
import flash.events.Event;
import flash.events.ProgressEvent;
import flash.display.BitmapData;
import gs.plugins.*;
import gs.TweenLite;
import gs.easing.*;
import gs.*;
import com.efnx.GUI.*

var BlackPattern:tile = new tile(“images/blackpattern.png”, 1955, 1024);
addChildAt(BlackPattern,0);

var BlackPatternXPos:Number = swfWidth – 1955;
var BlackPatternYPos:Number = swfHeight – 1024;

BlackPattern.x = BlackPatternXPos / 2 ;
BlackPattern.y = 0;

var BlackPattern2:tile = new tile(“images/blackpattern.png”, 1955, 1024);
addChildAt(BlackPattern2,2);
BlackPattern2.alpha = .7;

var BlackPattern2XPos:Number = swfWidth – 1955;
var BlackPattern2YPos:Number = swfHeight – 1024;

BlackPattern2.x = BlackPattern2XPos / 2 ;
BlackPattern2.y = 0;

BlackPattern2.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);

var beam:tile = new tile(“images/beam.png”, 1280, 1150);
function onComplete(ev:Event):void
{
addChildAt(beam,1);
}

beam.alpha = .8

var beamXPos:Number = swfWidth – 1280;
var beamYPos:Number = swfHeight – 1150;

beam.x = beamXPos/2;
beam.y = 0;

Honestly Im not sure if im doing it correctly, is there other way where i could load the “blackpattern1″ and “blackpattern2″ before loading the “beam”

thank you so much.

Great AS3 Class!! very helpful!!

By: Schell

Schell — Fri, 18 Dec 2009 18:36:17 +0000

>>pixteur
Well, it’s been a very long time since I first wrote the class, but, you should be able to treat it just like any other Sprite (though I’m not sure about the other classes in the comments). I’m sorry if this sounds trite: when you are adding your DisplayObjects to the Stage, just make sure you add them in a way that you can keep track of the order. It’s easiest just to keep all of your calls to addChild() in a block. Put the addChild() call for the tile in the middle, then you’ll know the tiling is in the middle of the display list. You must also be aware that if you’re tiling a completely opaque tile and stretching the tile to the full stageWidth and stageHeight of the flash window, you won’t see anything that might be behind the tile.

By: pixteur

pixteur — Fri, 18 Dec 2009 14:39:07 +0000

Thanks for this class.

I have gotten brndn’s version working but am still having trouble getting the tiled image not to go on top of everything.

I tried various versions of setChildIndex(bg, 0); and I can get it to go behind everything, but I cann’t seem to get it to layer in the middle of several movie clips.

I’ve tried the setChildIndex(bg,numChildren – 1); technique doing the same to the other movie clips to control the order but it doesn’t work. Any ideas? cheers

By: Schell

Schell — Mon, 02 Nov 2009 17:12:45 +0000

Great! Thanks.

By: brndn

brndn — Mon, 02 Nov 2009 14:19:51 +0000

Found a bug with Ringo’s class, when it resized, it litterally was stacking backgrounds ontop.
Also added a blendmode option. for more complex and layered backgrounds. nothing too advanced but possibly useful.

package {

/**
* Import required packages.
*/
import flash.display.Bitmap;
import flash.display.Shape;
import flash.display.BlendMode;
import flash.display.BitmapData;
import flash.display.Loader;
import flash.display.Sprite;
import flash.display.Stage;
import flash.display.StageAlign;
import flash.events.*;
import flash.net.URLRequest;

/**
* Class definition.
*/
public class TileBG extends Sprite {

/**
* Class variables.
*/
public static var identifier:int;
public var bitmap:Bitmap = new Bitmap();
public var stageInstance:Stage;
public var _blendMode:String;
public var child:Shape;
/**
* Class constructor.
*/
public function TileBG(obj:*, stage, blend:String):void {
identifier++;
_blendMode = blend;
name = 'bgSprite-' + identifier;
stageInstance = stage;

if(obj is BitmapData) {
bitmap.bitmapData = obj;
resize();
} else if (obj is String) {
var url:URLRequest = new URLRequest(obj);
var loader:Loader = new Loader();
configureListeners(loader.contentLoaderInfo);
loader.load(url);
} else {
throw new Error("Problem : First parameter obj must be a string \"path_to_image\" or bitmapData.");
}
stageInstance.addEventListener(Event.RESIZE, resize);
}

/**
* Configure the loader object events.
*/
private function configureListeners(dispatcher:IEventDispatcher):void {
dispatcher.addEventListener(Event.COMPLETE, loaderComplete);
dispatcher.addEventListener(IOErrorEvent.IO_ERROR, loaderError);
}

/**
* Loader object complete event.
*/
private function loaderComplete(event:Event):void {
bitmap.bitmapData = Bitmap(event.target.content).bitmapData;
resize();
}

/**
* Loader object error event.
*/
private function loaderError(event:Event):void {
throw new Error("Problem : There was an error accessing the image file.");
}

/**
* Resize the background sprite to the stage size.
*/
private function resize(event:Event = null) {

if(child != null){
stageInstance.removeChild(child);

}
child = new Shape();

child.graphics.beginBitmapFill(bitmap.bitmapData);
child.graphics.drawRect(0, 0, stageInstance.stageWidth, stageInstance.stageHeight);
child.graphics.endFill();
stageInstance.align = StageAlign.TOP_LEFT;
stageInstance.addChild(child);
child.blendMode = _blendMode;
}

}

}

var bg:TileBG = new TileBG("pattern1.png", stage, "difference" );