I’ve been working on my site for a few weeks now, and I have developed a class that will handle how I display assets on my site.
Basically, it “throws” in items into the stage, and you could shuffle them around or you could stack them up. I’ve made it very easy to use, and it’s still under development, but I think it’s ready to be used by others. This is my first class I’ve ever shared, and though it’s not much, I hope someone likes it or maybe even use it.
You can use any DisplayObject as the ‘items’ of the Shuffler.
There are explanations in the code, but here are some important points
- shuffle() - shuffles the items
- stack() - stacks the items
- setFocusOn(item:DisplayObject) - sets the item param as the focused item
- addItem(item:DisplayObject) - adds item param to the shuffler
- deleteItem(index:int) - deletes the item at index
- has max property for maximum number of boxes allowed. 0 for infinite.
Here is an example:
Sample usage in code:
[sourcecode language='js']
package{
import flash.display.DisplayObject;
import flash.display.Sprite;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.*;
import flash.text.TextField;
import com.mindfock.ui.Shuffler;
public class TestShuffler extends Sprite{
private var boxes:Array;
private var shuffler:Shuffler;
private var stacker:TextField;
private var shuffle:TextField;
private var adder:TextField;
public function TestShuffler(){
init();
}
public function init():void{
shuffler = new Shuffler(400, 300, 6);
createBoxes(6);
createButtons();
addChild(shuffler);
}
private function createBoxes(num:int):void{
boxes = new Array();
for (var i:int = 0; i < num; i++)
{
trace("created");
var box:Sprite = drawBox(50, 50) as Sprite;
boxes.push(box);
shuffler.addItem(box);
}
}
private function drawBox(w:Number, h:Number):DisplayObject{
var box:Sprite = new Sprite();
box.graphics.lineStyle(2, 0x000000);
box.graphics.beginFill(Math.random() * 16000000);
box.graphics.drawRect(0, 0, 100, 100);
box.graphics.endFill();
return box;
}
private function createButtons():void
{
// I've left out the drawing of the buttons
square.addEventListener(MouseEvent.CLICK, shuffleHandler);
square2.addEventListener(MouseEvent.CLICK, stackHandler);
square3.addEventListener(MouseEvent.CLICK, addHandler);
}
private function shuffleHandler(event:MouseEvent):void{
shuffler.shuffle();
}
private function stackHandler(event:MouseEvent):void{
shuffler.stack();
}
private function addHandler(event:MouseEvent):void{
var newBox:Sprite = drawBox(50, 50) as Sprite;
shuffler.addItem(newBox);
}
}
}
[/sourcecode]
Just save it in your classpath, under com/mindfock/ui
You need TweenLite for the tweening animations… If you don’t know what it is, you should look into tweening engines. They will save you a lot of hard work.
Now that I’ve got the main bulk of my site done, I hope I can finish it before classes start. ![]()
leave a reply