Flash Helps: Tile Component

Posted April 2009 by Dan

When Flash CS3 came out one of the new components was the Tile Component. The Tile Component in AS3 is similar to the Datagrid component in that it uses columns and rows to render data and images. The Tile Component can come in very useful in many instances of design and implementation.

Flash has a few examples of using the Tile Component in the helps. I’ve taken one of those examples and tweaked it a bit below. I put a text field on the stage with an instance name of myText and created a movieClip on the stage as well with the instance name of myMC.

The actionscript for using the Tile Component is as follows.  You’ll notice that it has some of the same properties as the DataGrid…like I mentioned.

import fl.controls.ScrollPolicy;
import fl.controls.TileList;
import fl.data.DataProvider;
import fl.controls.UIScrollBar;
import fl.events.ScrollEvent;
import fl.controls.ScrollBarDirection;

myText.text = "Select an Image";

//add a bunch of images and labels
var dp:DataProvider = new DataProvider();
dp.addItem({label:"Image 1", source:"http://www.helpexamples.com/flash/images/image1.jpg"});
dp.addItem({label:"Image 2", source:"http://www.helpexamples.com/flash/images/image2.jpg"});
dp.addItem({label:"Image 3", source:"http://www.helpexamples.com/flash/images/image3.jpg"});
dp.addItem({label:"Image 4", source:"http://www.helpexamples.com/flash/images/image1.jpg"});
dp.addItem({label:"Image 5", source:"http://www.helpexamples.com/flash/images/image2.jpg"});
dp.addItem({label:"Image 6", source:"http://www.helpexamples.com/flash/images/image3.jpg"});
dp.addItem({label:"Image 7", source:"http://www.helpexamples.com/flash/images/image1.jpg"});
dp.addItem({label:"Image 8", source:"http://www.helpexamples.com/flash/images/image2.jpg"});
dp.addItem({label:"Image 9", source:"http://www.helpexamples.com/flash/images/image3.jpg"});
dp.addItem({label:"Image 10", source:"http://www.helpexamples.com/flash/images/image2.jpg"});
dp.addItem({label:"Image 11", source:"http://www.helpexamples.com/flash/images/image2.jpg"});
dp.addItem({label:"Image 12", source:"http://www.helpexamples.com/flash/images/image3.jpg"});

var myTileList:TileList = new TileList();
myTileList.dataProvider = dp;
myTileList.scrollPolicy = ScrollPolicy.ON;
myTileList.columnWidth = 100;
myTileList.rowHeight = 67;
myTileList.setSize(400,67);
myTileList.columnCount = 3;
myTileList.rowCount = 1;
myTileList.move(10, 300);
addChild(myTileList);

myTileList.addEventListener(MouseEvent.CLICK,itemClicked);
function itemClicked(e:Event):void {
//myText
myText.text = myTileList.selectedItem.label;
//myMC
var i =new Loader();
i.load(new URLRequest(myTileList.selectedItem.source));
myMC.addChild(i);
}

Here are the sample files:

tileComponent.swf
tileComponent.fla

Related Posts:

Posted in: Flash Helps | Comments Off

Flash Helps: Flashvars in AS3

Posted January 2009 by Dan

Another new feature in AS3 ( actionscript 3 ) is the new method of calling and setting flashvars in your actionscript.  Back in actionscript 2, you just call them after setting them in your html code.  AS3 is different.  While there are a few methods to do this, the simplest way I’ve found is this:

//the name of my flashvar is myVar

myText.text = root.loaderInfo.parameters.myVar;

Then you can use the Flash AS3 global variable method I use here to set your flashvar in as3 as a global variable.

MyGlobal.myString = root.loaderInfo.parameters.myVar;

Related Posts:

Posted in: Flash Helps | Comments Off