Featured Posts

Remove and null all children I often ask myself, how it is possible to remove and null all underlying children of a object. So I write a small function, which removes and null all children from a parent object. It also checks, if...

Read more

Making a color darker or lighter When working with shapes which have a gradient, you would like to use a darker or lighter color of the first color as second color for the gradient. (Confusing I know). So you can do this by adjusting...

Read more

Saving the alphabet in an array Sometimes you would like to have the whole alphabet in an array. It´s very easy to do this by writing each letter of the alphabet in an array. But you can also use a handy function which gets two parameters,...

Read more

Resizing your Flash App I've seen several sites recently that were designed at a static resolution and not resizing to take advantage of those on larger screens, I have 2 x 22".  This is a little frustrating when viewing photos...

Read more

FancyText Explorer released I´m very proud to present you the new FancyText Explorer. But what is FancyText??? FancyText is a Text Tween Engine driven with TweenMax and TimelineMax, which allows to tween each single line, word...

Read more

  • Prev
  • Next

Remove and null all children

0

Category : Performance, Snippets

I often ask myself, how it is possible to remove and null all underlying children of a object. So I write a small function, which removes and null all children from a parent object. It also checks, if a child is a DisplayObjectContainer, which could even hold more children.

function removeAllChildren(parentChild:*):void
{
	for(var i:uint = 0; i < parentChild.numChildren;++i)
	{
		//check if child is a DisplayObjectContainer, which could hold more children
		if(parentChild.getChildAt(i) is DisplayObjectContainer) removeAllChildren(DisplayObjectContainer(parentChild.getChildAt(i)));
		else
		{
			//remove and null child of parent
			var child:DisplayObject = parentChild.getChildAt(i);
			parentChild.removeChild(child);
			child = null;
		}
 
	}
	//remove and null parent
	parentChild.parent.removeChild(parentChild);
	parentChild = null;
}
 

Just pass e.g. a MovieClip as paramter and all underlying children will be removed and set to null:

 
removeAllChildren(yourMc);
 

You could also do this with your root:

 
removeAllChildren(root);
 

Best,
Rafael

Making a color darker or lighter

0

Category : Math, Snippets

When working with shapes which have a gradient, you would like to use a darker or lighter color of the first color as second color for the gradient. (Confusing I know).

So you can do this by adjusting the desired color in a color picker or you can do this by dint of a little AS3 function.

Select a color with the Color Picker and move the scroller to darken or to light the color:

The Flash plugin is required to view this object.


Here is the function which makes your color darker or lighter. As arguments you have to pass the color and a value between -225(darker) and 255(lighter). This sounds plausible, I think so.

function colorTint(color:uint, tintValue:Number):Number
{
	var colorTransform:ColorTransform = new ColorTransform();
	colorTransform.color = color;
	colorTransform.redOffset = colorTransform.redOffset + tintValue < 0 ? 0 : colorTransform.redOffset + tintValue;
	if(colorTransform.redOffset > 255) colorTransform.redOffset = 255;
	colorTransform.greenOffset = colorTransform.greenOffset + tintValue < 0 ? 0 : colorTransform.greenOffset + tintValue;
	if(colorTransform.greenOffset > 255) colorTransform.greenOffset = 255;
	colorTransform.blueOffset = colorTransform.blueOffset + tintValue < 0 ? 0 : colorTransform.blueOffset + tintValue;
	if(colorTransform.blueOffset > 255) colorTransform.blueOffset = 255;
 
	return colorTransform.color;
}
 


All the best,
Rafael

Saving the alphabet in an array

0

Category : Snippets, Text

Sometimes you would like to have the whole alphabet in an array. It´s very easy to do this by writing each letter of the alphabet in an array. But you can also use a handy function which gets two parameters, the start character and the end character. The function returns an array with all letters between these two characters.

If you have a closer look at the ASCII table, you will see that each character has an own decimal number which can be used with the static method fromCharCode() of the String class.

So this is my function:

var uppercaseLetters:Array = getChars("A", "Z");
 
function getChars(startChar:String, endChar:String):Array
{
	var startUnicode:Number = startChar.charCodeAt(0);
	var endUnicode:Number = endChar.charCodeAt(0);
	var chars:Array = [];
 
	for(var i:uint = startUnicode; i <= endUnicode; ++i)
	{
		chars.push(String.fromCharCode(i));
	}
 
	return chars;
}
 
trace(uppercaseLetters);
//output:A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R,S,T,U,V,W,X,Y,Z
 

If you would like to get the alphabet in uppercase and lowercase, you can´t do this:

var allLetters:Array = getChars("A", "z");
 

This will return an array with some other special characters. Just create two arrays and concat them like this:

var uppercaseLetters:Array = getChars("A", "Z");
var lowercaseLetters:Array = getChars("a", "z");
var allLetters:Array = uppercaseLetters.concat(lowercaseLetters);
 

Resizing your Flash App

0

Category : Quick Tips

I've seen several sites recently that were designed at a static resolution and not resizing to take advantage of those on larger screens, I have 2 x 22".  This is a little frustrating when viewing photos or images which could be enlarged and therefore potentially easier to see...
Resizing your Flash app isn't too hard if you take it into account from the start, the following excerpt of code is all that is needed to get started...

stage.align = StageAlign.TOP_LEFT;
stage.scaleMode = StageScaleMode.NO_SCALE;
 
stage.addEventListener(Event.RESIZE, resizeHandler);
 
function resizeHandler(e:Event):void
{
    trace("wi: " + stage.stageWidth + ", he: " + stage.stageHeight);
}
 

So, what does this do?
Firstly it sets the stage align and scaleMode properties so that the stage resizes from the top left corner and doesn't scale the content as its resized.  We then listen for the RESIZE Event, which when triggered traces out the width and height of the stage...
Next time we'll further this tip to re-position objects into each corner and centre of the app, stay tuned.

FancyText Explorer released

0

Category : Animations, Projects

I´m very proud to present you the new FancyText Explorer. But what is FancyText???
FancyText is a Text Tween Engine driven with TweenMax and TimelineMax, which allows to tween each single line, word or letter of your textfield.

You can purchase FancyText at activeden.net . Now I construct an own Explorer for it, which simplify to develop his own cool transitions and getting directly the correct ActionScript 3 code for it. So play around with the settings.
There is also a full ASDoc.

The Flash plugin is required to view this object.

Sorting objects in an array according to their position

0

Category : Math, Snippets

I played around with the sortOn(); method few weeks ago and recognized that its a very important and strong function to sort display objects that are stored in an array. You can sort your display objects according to any property of the DisplayObject class.

So for example you would like to sort all movieclips in an array according to their x position, started with the lowest x position.

var mcs:Array = new Array(mc1,mc2,mc3,mc4);
mcs.sortOn("x", Array.NUMERIC);
 

You can also use multiple properties as sort parameters. First sort mcs according to their x-positions and then to their y-positions, started with the lowest position.

mcs.sortOn(["x", "y"], Array.NUMERIC);
 

You have also the opportunity to start with highest position, just use the Array.DESCENDING constant.

mcs.sortOn(["x", "y"], Array.NUMERIC | Array.DESCENDING);
 

Best,
Rafael

Position objects in a custom grid

0

Category : Math, Snippets

This snippets is very useful for dynamic content which should be positioned in a custom grid. For example you would like to create a 3x3 grid. I already contributed a tutorial at the activeden blog, where I used this technique with an image gallery.

See my example:

The Flash plugin is required to view this object.


I´m using the modulo operator for this, which is very helpful math instrument.

//numbers of squares
var numSquares:uint = 9;
//numbers of cols
var cols:uint = 3;
//the offset between each row
var rowOffset:Number = 20;
var square:Sprite;
 
for(var i:uint = 0; i < numSquares; ++i)
{
	//create a new sprite with a black rectangle
	square = new Sprite();
	square.graphics.beginFill(0x000000);
	square.graphics.drawRect(0, 0, 20, 20);
	square.graphics.endFill();
 
	//set each 4.th square in a new row
	if(i % cols == 0 && i != 0)
	{
		rowOffset += 40;
	}
	//position each square on the x-axis and y-axis
	square.x = 20 + 40 * (i % cols);
	square.y = rowOffset;
	this.addChild(square);
}
 

Enjoy!

One-Liners: Initialise & AddChild

0

Category : Quick Tips

If you're wanting to initialise a display object and then add it to the stage immediatley the following should be familiar...

//declare and initialise a sprite
var test:Sprite = new Sprite();
 
// add to the stage
addChild(test);
 

However, you can reduce it to being all on one line...

// declare, initialise and add sprite to stage
var test:Sprite = Sprite(addChild(new Sprite()));
 

This looks a little more complex so how does it work...?

Well, the addChild(..) method returns the DisplayObject passed as a parameter which in this case is a new Sprite instance. Finally because the addChild function returns a data type of DisplayObject, rather than Sprite, we cast it to Sprite.  Easy!

xml vs. cache

2

Category : Snippets, XML

I´m reading tons of posts in forums, where was asked how to solve the problem to load a xml with current data and to clear the cache from flash. But there is an easy solution to get the current data of your xml. Just use a timestamp and you won´t have any problems with the cache.

var myDate:Date = new Date();
var timestamp:Number = myDate.getTime();
var XMLLoader:URLLoader = new URLLoader();
XMLLoader.addEventListener(Event.COMPLETE, xmlLoaded);
XMLLoader.load(new URLRequest("yourxml.xml?" + timestamp));
 
function xmlLoaded(evt:Event):void
{
	xml = XML(evt.target.data);
	trace(xml) //your current xml data
}
 

Best,
Rafael

buttonMode for a single object in Papervision 3D

0

Category : Papervision 3D, Snippets

There is no buttonMode property in the DisplayObject3D class in Papervision 3D. But there is a buttonMode for the viewport. So this would be my solution to create a hand cursor on a object.

your3dObject.addEventListener(InteractiveScene3DEvent.OBJECT_OVER, over3dObject);
your3dObject.addEventListener(InteractiveScene3DEvent.OBJECT_OUT, out3dObject);
 
//active buttonMode
function over3dObject(evt:InteractiveScene3DEvent):void
{
	this.viewport.buttonMode = true;
}
 
//disable buttonMode
function out3dObject(evt:InteractiveScene3DEvent):void
{
	this.viewport.buttonMode = false;
}
 


If you are working with ViewportLayers, you can also use this technique.

var my3dObjectLayer:ViewportLayer = this.viewport.getChildLayer(my3dObject);
my3dObjectLayer.buttonMode = true;
 

Which solution is the best depends what you are building with Pv3D, just try it out!

Best,
Rafael