Advanced Flash Components
Search!
Search!
Home >  Components >  Carousel (AS 3.0) >  API Documentation
API Documentation
Carousel (AS 3.0) V. 2.1 Documentation
Properties
Name Type Description
carouselStyle Object Property defines image size. Please note that width and height parameters override maintainAspectRatio and scaleContent properties.

    1. perspective:Number
    2. angle:Number
    3. position:String. (positive or negative)

Example

myCarousel.carouselStyle = {perspective: .5, angle: 0, position: positive};
content Object Defines displayed content.

    1.description:String
    2.path:Mixed
    3.type:String – content type
    com.afcomponents.common.ContentType
        ContentType.IMAGE
        ContentType.INSTANCE
    4.data - Miscellaneous property

Example

import fl.data.DataProvider;

function onCarouselInit(event:CarouselEvent) {
var dp:DataProvider = new DataProvider();
dp.addItem({path:"img_1.jpg", type:"image", description:"test", data:"test"});
dp.addItem({path:"img_2.jpg", type:"image", description:"test", data:"test"});
dp.addItem({path:"img_3.jpg", type:"image", description:"test", data:"test"});

myCarousel.content = dp;
}
myCarousel.addEventListener(CarouselEvent.INITIALIZE, onCarouselInit);
contentXML String Path to content XML file or RSS 2.0 image feed.

XML File Format

<content>
    <item>
        <description>Image 1</description>
        <path>image.jpg</path>
        <data>
url.html</data>
        <type>image</type>
    </item>
</content>

Example

myScroll.contentXML = "file.xml";


Note: You can use a custom node in your XML and it becomes of property of the item.

Custom Node XML Example

<content>
    <item>
        <description>Image 1</description>
        <path>image.jpg</path>
        <data>url.html</data>
        <name>MyCustomNode</name>   
    </item>
</content>

trace(myCarousel.getSelectedItem().name);
contentStyle Object Property defines image size. Please note that width and height parameters override maintainAspectRatio and scaleContent properties.

    1. width:Number
    2. height:Number
    3. maintainAspectRatio:Boolean
    4. scaleContent:Boolean
    5. padding:Number – horizontal padding
    6. autoSize:Boolean

Example

myCarousel.contentStyle = {width:100, height:150, maintainAspectRatio:true, scaleContent:true, padding:10, autoSize: false};
itemContainerDefaultStyle Object Defines the default item container shape style.

    1.fill:Bolean
    2.fillColor:Number (ARGB)
    3.fillGradient:Object [ActionScript Only]
    4.stroke:Boolean
    5.strokeColor:Number (ARGB)
    6.cornerRadius:Number
    7.horizontalPadding:Number
    8.verticalPadding:Number

Example

myCarousel.itemContainerDefaultStyle = {fill:true, fillColor:0xFF0000CC, stroke:false, strokeColor:0x00FF00CC, cornerRadius:2, horizontalPadding: 5, verticalPadding: 5};
itemContainerOverStyle Object Defines the item container shape style on mouse over event.

  
    1.fill:Bolean
    2.fillColor:Number (ARGB)
    3.fillGradient:Object [ActionScript Only]
    4.stroke:Boolean
    5.strokeColor:Number (ARGB)
    6.cornerRadius:Number
    7.horizontalPadding:Number
    8.verticalPadding:Number

Example

myCarousel.itemContainerOverStyle = {fill:true, fillColor:0xFF0000CC, stroke:false, strokeColor:0x00FF00CC, cornerRadius:2, horizontalPadding: 5, verticalPadding: 5};
itemContainerSelectedStyle Object
    1.fill:Bolean
    2.fillColor:Number (ARGB)
    3.fillGradient:Object [ActionScript Only]
    4.stroke:Boolean
    5.strokeColor:Number (ARGB)
    6.cornerRadius:Number
    7.horizontalPadding:Number
    8.verticalPadding:Number

Example

myCarousel.itemContainerSelectedStyle = {fill:true, fillColor:0xFF0000CC, stroke:false, strokeColor:0x00FF00CC, cornerRadius:2, horizontalPadding: 5, verticalPadding: 5};
previewClip String Property defines a class of a placeholder movie clip.

Example

myCarousel.previewClip = "MyClip";
reflectionStyle Object Set the reflection.

    1. enable:Bolean
    2. alpha:Number
    3. clipAlpha:Number
    4. distance:Number
    5. matrixRatio:Number
    6. matrixDropOff:Number

Example

myCarousel.reflectionStyle = {enable:true, alpha: 0.8, clipAlpha: 0.5, distance: 1, matrixRatio: 1, matrixDropOff: 1};
scrollAnimation Object Property defines scroll properties.

Properties

    1. enabled:Boolean
    2. motion:fl.motion.easing
        (Back, Bounce, Circular, Cubic, Elastic, Exponential, Linear,
        Quadratic, Quatric, Quintric, or Sine)
    3. easing:String
        (easeIn, easeInOut, easeOut, or easeNone)
    4. speed:Number

Example

myCarousel.scrollAnimation = {motin:fl.motion.easing.Back, easing:"easeIn",speed:10}
selectedItem Number Defines initially selected item. First item is selected by default.

Example

myCarousel.selectedItem = 5;
selectedItemAlign Void Defines the alignment of the selected item. If set to “CENTER” the selected item is moved to the center of the component. If set to “DYNAMIC” then the selected item is not moved.

Example

myCarousel.selectedItemAlign = ItemsAlign.CENTER;
selectOnPageScroll Boolean Defines whether an item gets selected once the page scroll is activated.

Example

myCarousel.selectOnPageScroll = false;
slideShow Object Defines slide show properties.

    1. enabled:Boolean
    2. loop:Boolean
    3. time:Boolean [time in seconds]

myCarousel.slideShow = {enabled:true, loop:false, time:5};
transition Object Property determines whether to display image transition (true) or not (false). Fade transition is displayed after thumbnail image has been loaded.

Options

    1. enable:Boolean
    2. transition:fl.transitions
        (Blinds, Fly, Fade, Iris, Photo, PixelDissolve, Rotate, Squizee, Wipe,
        or Zoom)
    2. motion:Class
    3. easing:String
    4. duration:Number

Example

myCarousel.transition = {enable:true, transition:fl.transition.PixelDissolve, motion:fl.motion.easing.Linear,duration:1}
scrollBar Object An instance of the UIScrollbar component that would be used to control the Carousel.

Example

myCarousel.scrollBar = myScrollbar;
length Number Read-only property indicates the number of items in the Carousel.

Example

trace(myCarousel.length);
Methods
Name Return Type Description
getItemNum( index:Number ) Object Returns content item object specified by index parameter.

Example

var item:Object = new Object();

item = myCarousel.getItemNum(2);
trace(item.description);
trace(item.path);
trace(item.data);
trace(item.id);
getTotalItems( ) Number Returns total number of items in the content object.

Example

var items = myCarousel.getTotalItems();
getSelectedItem( ) Object Returns selected item object.

Example


var item:Object = new Object();

item = myCarousel.getSelectedItem();
trace(item.description);
trace(item.path);
trace(item.data);
trace(item.id);
selectItem( item:Object ) Void Selects item specified by item parameter.

Example

var item:Object = new Object();

item = myCarousel.getItemNum(2);
myCarousel.selectItem(item);
selectItemNum( index:Number ) Void Selects item specified by index parameter.

Example

myCarousel.selectItemNum(2);
selectNextItem( ) Void Selects next item.

Example

myCarousel.selectNextItem();
selectPreviousItem( ) Void Selects previous item.

Example


myCarousel.selectPreviousItem();
addItem( item:Object ) Void Adds a new item to the Carousel.

Example

myCarousel.addItem({description:"Item", path:"image.jpg",data:"url.html", type:ContentType.IMAGE});
removeItem( item:Object ) Void Removes item from the Carousel.

Example


var item = myCarousel.getItemNum(3);
myCarousel.removeItem(item);
addGenericItemEventListener( event:String,
listener:Function
)
Void Adds an event listener to each item in the Carousel.

Generic Event Example

import flash.events.MouseEvent;
import com.afcomponents.events.CarouselEvent;

function eventHandler(event:MouseEvent){
    trace(event.target);
}

function onCarouselContentLoaded(event:CarouselEvent) {
    myCarousel.addGenericItemEventListener(MouseEvent.CLICK, eventHandler);
}
myCarousel.addEventListener(CarouselEvent.CONTENT_LOAD_COMPLETE, onCarouselContentLoaded);
getItemAt( index:Number ) Object Returns content item object specified by index parameter.

Example

var item:Object = new Object();

item = myCarousel.getItemAt(2);
trace(item.description);
trace(item.path);
trace(item.data);
trace(item.id);
selectItemAt( index:Number ) Void Selects the item specified in the index parameter.

Example


myCarousel.selectItemAt(3);
addItemAt( item:Object,
index:Number
)
Void Adds the object passed in the item parameter at index in the Carousel.

Example

myCarousel.addItemAt({description:"description", path:"pic.jpg", data:"url.html"}, 3);
removeItemAt( index:Number ) Void Removes the item at index from the Carousel.

Example

myCarousel.removeItemAt(3);
replaceItemAt( item:Object,
index:Number
)
Void Replaces the item at index with the passed item object.

Example

myCarousel.replaceItemAt({description:"description", path:"pic.jpg", data:"url.html"}, 3);
removeAll( ) Void Removes all items from the Carousel.

Example

myCarousel.removeAll();
addItemEventListener( index:Number,
event:String,
listener:Function
)
Void Adds an event listener to the item specified by index.

Example

myCarousel.addItemEventListener (4, MouseEvent.CLICK, eventHandler);
Events
Name Return Value Description
INITIALIZE type
target
Triggered after component initializes.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselInit(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.INITIALIZE, onCarouselInit);
ERROR type
target
message
Triggered when the component encounters an error.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselError(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
    trace(event.message);
}
myCarousel.addEventListener(CarouselEvent.ERROR, onCarouselError);
CHANGE type
target
Triggered when any of the component's properties are changed at runtime.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselChange(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.CHANGE, onCarouselChange);
XML_LOAD_START type
target
Triggered when XML starts loading.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselXMLLoadStart(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.XML_LOAD_START, onCarouselXMLLoadStart);
XML_LOAD_PROGRESS type
target
bytesLoaded
bytesTotal
Triggered during XML loading to indicate progress.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselXMLLoadProgress(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
    trace(event.bytesLoaded + " of " + event.bytesTotal);
}
myCarousel.addEventListener(CarouselEvent.XML_LOAD_PROGRESS, onCarouselXMLLoadProgress);
XML_LOAD_COMPLETE type
target
Triggered when XML loading is complete.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselXMLLoadComplete(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.XML_LOAD_COMPLETE, onCarouselXMLLoadComplete);
ITEM_LOAD_START type
target
Triggered for each item when it starts loading.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselItemLoadStart(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.ITEM_LOAD_START, onCarouselItemLoadStart);
ITEM_LOAD_PROGRESS type
target
bytesLoaded
bytesTotal
Triggered for each item during loading to indicate progress.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselItemLoadProgress(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
    trace(event.bytesLoaded + " of " + event.bytesTotal);
}
myCarousel.addEventListener(CarouselEvent.ITEM_LOAD_PROGRESS, onCarouselItemLoadProgress);
ITEM_LOAD_COMPLETE type
target
Triggered for each item when it is finished loading.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselItemLoadComplete(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.ITEM_LOAD_COMPLETE, onCarouselItemLoadComplete);
CONTENT_LOAD_START type
target
Triggered when content loading starts.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselContentLoadStart(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.CONTENT_LOAD_START, onCarouselContentLoadStart);
CONTENT_LOAD_PROGRESS type
target
itemsLoaded
itemsTotal
Triggered during content loading to indicate progress.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselContentLoadProgress(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
    trace(event.itemsLoaded + " of " + event.itemsTotal);
}
myCarousel.addEventListener(CarouselEvent.CONTENT_LOAD_PROGRESS, onCarouselContentLoadProgress);
CONTENT_LOAD_COMPLETE type
target
Triggered when content is finished loading.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselContentLoadComplete(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.CONTENT_LOAD_COMPLETE, onCarouselContentLoadComplete);
ITEM_SELECTED type
target
Triggered when a new item is selected.

Example


import com.afcomponents.events.CarouselEvent;

function onCarouselItemSelected(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.ITEM_SELECTED, onCarouselItemSelected);
TRANSITION_END type
target
Triggered when the selected item is finished moving into place.

Example

import com.afcomponents.events.CarouselEvent;

function onCarouselTransitionEnd(event:CarouselEvent) {
    trace(event.type);
    trace(event.target);
}
myCarousel.addEventListener(CarouselEvent.TRANSITION_END, onCarouselItemMoveComplete);