Instantiate Thumbnail Scroller using only code
Updated: Jul 9, 2010
Views: 284
Description: Learn how to instantiate and work with the Thumbnail Scroller component using only Actionscript code.
1. Drag an instance of the Thumbnail Scroller component in the Library.
2. Instantiate the component and add it to the stage.
import com.afcomponents.scroller.ThumbnailScroller;
var myScroller:ThumbnailScroller = new ThumbnailScroller();
addChild(myScroller);
var myScroller:ThumbnailScroller = new ThumbnailScroller();
addChild(myScroller);
3. Create an XML file, as explained in this tutorial, and pass it to the xmlPath property.
myScroller.xmlPath = "images.xml";
4. Set a few properties
myScroller.setSize(790, 100);
myScroller.move(20, 10);
myScroller.border = true;
myScroller.borderColor = 0x000000;
myScroller.handCursor = true;
myScroller.reflection = true;
myScroller.move(20, 10);
myScroller.border = true;
myScroller.borderColor = 0x000000;
myScroller.handCursor = true;
myScroller.reflection = true;
5. When an item is selected scroll to it.
import com.
afcomponents
.events.ScrollerEvent;
myScroller.addEventListener(ScrollerEvent.ITEM_CLICK, itemClickHandler);
function itemClickHandler(event:ScrollerEvent):void
{
myScroller.select(event.index);
}
myScroller.addEventListener(ScrollerEvent.ITEM_CLICK, itemClickHandler);
function itemClickHandler(event:ScrollerEvent):void
{
myScroller.select(event.index);
}
Here's the complete code:
//import the ThumbnailScroller class
import com.
import com.
afcomponents
.scroller.ThumbnailScroller;
import com.
import com.
afcomponents
.events.ScrollerEvent;
// create an instance of the ThumbnailScroller
var myScroller:ThumbnailScroller = new ThumbnailScroller();
// add the instance to the display list
addChild(myScroller);
// set the source
myScroller.xmlPath = "images.xml";
// set the dimension and position
myScroller.setSize(790, 100);
myScroller.move(20, 10);
// set some properties
myScroller.border = true;
myScroller.borderColor = 0x000000;
myScroller.handCursor = true;
myScroller.reflection = true;
// listen for item clicks
myScroller.addEventListener(ScrollerEvent.ITEM_CLICK, itemClickHandler);
function itemClickHandler(event:ScrollerEvent):void
{
// when an item is clicked scroll to that item
myScroller.select(event.index);
}
// create an instance of the ThumbnailScroller
var myScroller:ThumbnailScroller = new ThumbnailScroller();
// add the instance to the display list
addChild(myScroller);
// set the source
myScroller.xmlPath = "images.xml";
// set the dimension and position
myScroller.setSize(790, 100);
myScroller.move(20, 10);
// set some properties
myScroller.border = true;
myScroller.borderColor = 0x000000;
myScroller.handCursor = true;
myScroller.reflection = true;
// listen for item clicks
myScroller.addEventListener(ScrollerEvent.ITEM_CLICK, itemClickHandler);
function itemClickHandler(event:ScrollerEvent):void
{
// when an item is clicked scroll to that item
myScroller.select(event.index);
}
