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