Keyboard Issues – Left Arrow + Up Arrow + SPACE

In the few games that I tried to create ( yes, many left in development because of time and mood ) I rarely used key combinations. The ones I am talking about right now refers to arrows and space keys. Some combination of three of these give a lot of troubles and to a lot of people seems they are not working.

I found out that it’s not a Flash issue but more a hardware issue on some keyboards and the solution to that is not using arrow keys as your controls.  WASD seems to be the best choice.

[ AS3] Masking Dynamic Content TextField and cacheAsBitmap

Ok, this is a quick post.

In a little project I am working right now I had to do some effects involving some textfield masking.  The problem I had is that the text was never masked and it always was visible on the display list. To solve this problem I had to use the cacheAsBitmap propriety of display objects. Once I set that to true everything went smooth.

Waving Text Effect in Actionscript 3.0

var text:String       = "This text is a waving text";
var format:TextFormat = new TextFormat("Arial", 12);
var radius:int = 5;
var speed:Number = Math.PI/15;
var angle:Number =0
var letters:Array = null;

function Init():void
	letters = [];
	for (var a = 0, x = 0; a<text.length; a++)
		letters[a] = new Sprite();
		var txt:TextField =  new TextField();
		txt.selectable = false;
		txt.autoSize = "left";
		txt.text = text.charAt(a);
		letters[a].x = a * 15;
	addEventListener(Event.ENTERFRAME, Animate, false, 0, true); 


function Animate(e:Event):void
	for (var a = 0; a<letters.length; a++) 
		letters[a].y = Math.sin(angle+a)*radius;
	angle += speed;


Random Generated Displacement Map

So,  I was following this tutorial from activetuts+ to create the same effect,  a static distortion effect using the displacement map filter,  in one of my game projects and it was cool until I realized that my project is getting fatter and fatter by adding images of different sizes to use for different sized objects.

Ofcourse, this was not acceptable so I thought I could create a random generated image by code and reuse it than to create different images in Photoshop.

Anyway, here’s the code which is generating a random image to be used with the effect in the tutorial.

function rndImage(w:Number, h:Number, wl:int = 0, bl:int =0):BitmapData
var bitmapdata:BitmapData = new BitmapData(w,h,false, 0xDDDDDD);
var randY:int = 0;
var randX:int = 0;
var randW:int = 0;
var thick:Number = 0;
var a:int = 0;
var minWidth:int = 0;
var line:Shape = new Shape();

for ( a = 0; a< wl; a++)
thick = Math.random()* 1.3 + 0.2;
randY = Math.random() * h;
minWidth = (40 * w)/100;
randW = Math.random() * (w-minWidth) + minWidth;
randX = Math.random() * ((w-randW));, 0xFFFFFF);,randY);, randY);

for ( a = 0; a< bl; a++)
thick = Math.random()* 1.3 + 0.2;
randY = Math.random() * h;
minWidth = (40 * w)/100;
randW = Math.random() * (w-minWidth) + minWidth;
randX = Math.random() * ((w-randW));, 0x000000);,randY);, randY);


return bitmapdata;

And this is how you generate the image

rndImage(width,height, nr_white_lines,nr_dark_lines);

Detect Mouse Inactivity in Actionscript 3.0

Before we start you need to be familiar with MouseEvent and Timer classes.

var _timer:Timer = new Timer(5000);

function Start():void
   _timer.addEventListener(TimerEvent.TIMER, ShowMsg, false, 0, true);

   stage.addEventListener(MouseEvent.MOUSE_MOVE, StopTimer, false, 0, true);
   stage.addEventListener(MouseEvent.MOUSE_DOWN, StopTimer, false, 0, true);
   stage.addEventListener(MouseEvent.MOUSE_UP, StopTimer, false, 0, true);

function ShowMsg(e:TimerEvent):void
   trace("There is no activity");

function StopTimer(e:MouseEvent):void


The first thing I’ve done is to setup a Timer object to count up to 5 seconds ( you can change that to what ever numer of seconds you want ).

The timer object also has an event listener so we can know when the 5 seconds are over.

I have setup some event listeners that will help detecting any actions of the mouse on the Stage ( MOUSE_DOWN, MOUSE_MOVE and MOUSE_UP )

If during those 5 seconds nothing happens ( mouse is not moved or performs a click ) ShowMsg() function will be fired up and give you a message of inactivity.

If the mouse is moved the StopTimer() function will be activated and reset timers count.

This is a useful and easy way to detect user activity.

Tween A Number with GreenSock’s Tweening Class

I am going to give you a little example on how to tween a number. This example can be used with other tweening classes as well like Caurina’s Tweener.

Pay attention that the variable we want to tween needs to be public otherwise you’ll get an error compiling the code.

We are going define a variable as an Object. This object will hold a value. The tweener will tween this object’s value.

public var my_number :Object  =  { value: 0 }; this.my_number,  .5, { value: 100 , onUpdate:function(){ trace (this.value); } } )


Collision detection alternatives to hitTest and hitTestObject

Since ages ago Flash has never had a perfect solution to detect collisions.

The old  HitTest  method from Actionscript 2.0 has been replaced in Actionscript 3.0 by two separated methods hitTestObject and hitTestPoint, but they are still not perfect.

Luckly there are some good alternatives ( depending on your project ). Here’s a list.

Mike Chambers’s BitmapData.hitTest for Collision Detection

Troy Gilbert’s Pixel-Perfect Collision

Corey O’Neil’s  Collision Detection Kit 





Mouse Follower with Angle Rotation

First create an arrow Movie Clip ( make sure the tip of the arrow is on the register point of the Movie Clip ) and add it to the scene and name it “arrow”.

You will also need Caurina Tweener ( but other tweeners can be used also ).

import caurina.transitions.Tweener;

stage.addEventListener(MouseEvent.MOUSE_MOVE, Moving, false, 0, true);

function Moving(e:Event):void
var X:Number =  mouseX - arrow.x;
var Y:Number = (mouseY - arrow.y) * -1;

var angle:Number = Math.atan(Y/X)/(Math.PI/180);

Tweener.addTween(arrow ,{x :mouseX, y: mouseY, time:2});

if (X<0) { 		angle += 180; 	} 	

if (Y>=0 && Y<0) {  angle += 360;}

arrow.rotation = (angle*-1) + 90;


Pie Preloader Animation in Actionscript 3.0 

	import flash.display.Shape;

	public class PiePreloader extends Shape
		private var _radius:Number = 0;
		private var _bc    :int    = 0;
		private var _fc    :int    = 0;
		private var _bs    :int    = 0;

		public function PiePreloader($radius:Number, $border_size:int, $border_color:int, $fill_color:int)
			_radius = $radius;
			_bs     = $border_size;
			_bc     = $border_color;
			_fc     = $fill_color;

		public function Draw($e:Number):void
			var $end   = 2*Math.PI*$e/100;;

			if ($end != 0)

				Curve(0, 0, 0, $end);,0);;

		private function Curve($x:Number, $y:Number, $start:Number, $end:Number)
			 var diff = Math.abs($end -$start);
			 var divs = Math.floor(diff/(Math.PI/4))+1;
			 var span = -(diff/(2*divs));
			 var rc   = _radius/Math.cos(span);$start)*_radius, Math.sin($start)*_radius);

			 for (var i=0; i<divs; ++i)
				  $end = $start+span;
				  $start = $end+span;$end)*rc, Math.sin($end)*rc, Math.cos($start)*_radius, Math.sin($start)*_radius);

			 return this;

How to use it:

var _preloader:PiePreloader = new PiePreloader(35, 1, 0x000000, 0x74C2E1);
_preloader.x = stage.stageWidth/2;
_preloader.y = stage.stageHeight/2;

var _loader:Loader = new Loader();
_loader.load(new URLRequest("punk.jpg"));
_loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, Progress, false, 0, true);
_loader.contentLoaderInfo.addEventListener(Event.COMPLETE,         Complete, false, 0, true);

function Progress($e:Event):void
	var $p:Number = $$*100;

function Complete($e:Event):void

Loading External Fonts in Actionscript 3.0

First step:

– create a flash file ( font.fla) linked to a actionscript class file (
– copy and paste the code bellow in

import flash.display.MovieClip;

public class CustomFont extends MovieClip
[Embed(source='/font.ttf', fontName='CUSTOM', mimeType='application/x-font')]
public static var CUSTOM:Class;

– compile the files, now you should have a font.swf in your folder.

Second step:

– create a flash file ( main.fla) linked to a actionscript class file (
– copy and paste the code bellow in

import flash.display.MovieClip;
import flash.display.Loader;
import flash.text.Font;
import flash.text.TextField;
import flash.text.TextFormat;
import flash.utils.getDefinitionByName;
import flash.utils.getQualifiedClassName;

public class Tutorial extends MovieClip
public function Tutorial()
var $loader:Loader = new Loader();
$loader.contentLoaderInfo.addEventListener(Event.COMPLETE, Complete, false, 0, true);
$loader.load(new URLRequest("font.swf"));

private function Complete($e:Event):void
var FontLibrary:Class = $$ as Class;


private function ShowText():void
var $tf:TextField = new TextField();
$tf.defaultTextFormat = new TextFormat("CUSTOM", 60,0x000000);
$tf.width = 500;
$tf.embedFonts = true;
$tf.text = "HELLO WORLD";

– compile the files and you should have your text with your custom font.