Custom Search
Avatar
  • Twitter
  • Facebook
  • del.icio.us
  • Digg
  • StumbleUpon
  • Technorati
  • LinkedIn
  • Live
  • MySpace
  • Reddit

Using FaderFileMaterial to create Slideshow

By: http://www.designscripting.com/2009/01/20/using-faderfilematerial-to-create-slideshow

The aim of this tutorial is to create slideshow using the FaderAPI.

FaderAPI that I released last week can be used to create Flash Slideshow within few steps. FaderAPI contains Fader Class and FaderFileMaterial classes to load and animate external Image and SWF files.

Features:
Some exciting features of the Slideshow are as follows

• Ability of handling Image and SWF together.
• SWF may also be an animated file.
• No Need of Preloader- Since the animation will not happens until the next file is loaded.
• Customized events to handle the Slideshow

Difficulty:
Beginners to Medium

FaderFileMaterial:

Here we are going to use the FaderFileMaterial to create slideshow.
FaderFileMaterial is a Class under FaderAPI, to load external contents like Image, SWF and animate them.
Now this makes the loading external content easier and animating them.

Steps to create Slideshow using Actionscript:

Import External Classes:

import com.utils.Fader.*;
import com.utils.Fader.FaderURL;
import com.utils.Fader.Events.*;

Importing the external classes makes the external classes available to use in Code.

Create FaderURL:

var _faderURLItems:FaderURL = new FaderURL();
_faderURLItems.addURL( "Images/image1.jpg" );
_faderURLItems.addURL( "Images/image2.jpg" );
_faderURLItems.addURL( "Images/image3.jpg" );
_faderURLItems.addURL( "Images/image4.jpg" );
_faderURLItems.addURL( "Images/image5.jpg" );
_faderURLItems.addURL( "SWF/swf1.swf" );

Create object for FaderURLItems, FaderURLItems are used as stack to store URLS of the external files.
addURL is public method of FaderURLItems to push URL into FaderURLItems Object. Later we will fetch URL one by one to load the external files.

Create FaderFileMaterial:

var _fader:FaderFileMaterial = new FaderFileMaterial( _faderURLItems, 5000, true );
_fader.addEventListener( ObjectEvent.FADER_INIT, handleInit );
_fader.addEventListener( ObjectEvent.FADER_ITEM_INIT, handleItemInit );
_fader.addEventListener( ObjectEvent.FADER_ITEM_PROGRESS, handleItemProgress );
_fader.addEventListener( ObjectEvent.FADER_ITEM_COMPLETE, handleItemComplete );
_fader.addEventListener( ObjectEvent.FADER_COMPLETE, handleComplete );
addChild( _fader )
_fader.start();

FaderFileMaterial fades the loaded external items. We are passing the Object of FaderURLItems which contains the URLS, delay, and Boolean to repeat the slideshow at end to constructor of FaderFileMaterial

fader.start() will initiates the Slideshow.

Note:
Add the Fader Object to the displayList. This makes the slideshow visible.

Online Documents for Classes used

FaderURL
FaderFileMaterial

Entire Example:

import com.utils.Fader.*;
import com.utils.Fader.FaderURL;
import com.utils.Fader.Events.*;

var _faderURLItems:FaderURL = new FaderURL();
_faderURLItems.addURL( "Images/image1.jpg" );
_faderURLItems.addURL( "Images/image2.jpg" );
_faderURLItems.addURL( "Images/image3.jpg" );
_faderURLItems.addURL( "Images/image4.jpg" );
_faderURLItems.addURL( "Images/image5.jpg" );
_faderURLItems.addURL( "SWF/swf1.swf" );

var _fader:FaderFileMaterial = new FaderFileMaterial( _faderURLItems, 5000, true );
_fader.addEventListener( ObjectEvent.FADER_INIT, handleInit );
_fader.addEventListener( ObjectEvent.FADER_ITEM_INIT, handleItemInit );
_fader.addEventListener( ObjectEvent.FADER_ITEM_PROGRESS, handleItemProgress );
_fader.addEventListener( ObjectEvent.FADER_ITEM_COMPLETE, handleItemComplete );
_fader.addEventListener( ObjectEvent.FADER_COMPLETE, handleComplete );
addChild( _fader )
_fader.start();

function handleInit( e:ObjectEvent ):void{
 trace("::::::::::Fader Started:::::::::")
}
function handleItemInit( e:ObjectEvent ):void{
 trace("init:: "+e.targetObject)
}
function handleItemProgress( e:ObjectEvent ):void{
 trace("progress::"+_fader.loaderPercentage)
}
function handleItemComplete( e:ObjectEvent ):void{
 trace("complete:: "+e.targetObject)
}
function handleComplete( e:ObjectEvent ):void{
 trace(":::::::::Fader Complete:::::::::")
}

stop_mc.addEventListener( MouseEvent.CLICK, handleStop );
start_mc.addEventListener( MouseEvent.CLICK, handleStart );

function handleStop( e:MouseEvent ):void{
 _fader.stop();
}
function handleStart( e:MouseEvent ):void{
 _fader.start();
}

One Comment, Comment or Ping

  1. Bomosoorn

    Here is my new funny cat picture! Like it?
    http://bigpichost.com/files/my_funny_cat_s9ykvpn5_thumb.jpg

Reply to “Using FaderFileMaterial to create Slideshow”

actionscript 3.0 Adobe adobe max adobe tv air application class components contact form database facebook Flash flash catalyst flash cs4 flash gallery flash game flash menu Flash Tutorial flash tutorials Flash Video flash website Flex Flex Tutorial flex tutorials google maps mp3 player papervision 3d php video tutorial xml
Powered by FeedBurner