About the WipeTransition component

The WipeTransition component lets you add various transitions, fades and wipes to a list of images or movie clips you provide, in order to create a compelling slide show for viewers. Properties for the WipeTransition component allow you to control the border, aspect ratio and sizing, order of transitions, delay time between images, etc. A transition is always applied to a set of 2 images called a 'top image' and a 'bottom image', where the 'top image' is the one fading in to replace the 'bottom image'. A set of stock transitions is packaged with this component, and custom transitions can easily be dropped into the component.

Related topics

WipeTransition parameters

You can use the the custom interface of the Component inspector to set the following properties for each WipeTransition component instance while authoring:

appendMode combines all lists of images and mc's specified in mcList, loadImageList and dataFile into one combined list if set to true.

autoStart if true, the 'slide show' begins automatically.

bgColor specifies a solid color to show behind images.

border if true, show a black border around the component.

borderMc specifies the linkage id of a movie clip to be used as the border.

currentIndex read-only; index into the master list of the current image being displayed.

dataFile an url of a file (xml or plain text) with a detailed list of images, transitions, and properties for each.

flipVertical if true, flip the transition effects vertically.

imageBytesLoaded read-only; number of bytes already loaded for the image currently being loaded.

imageBytesTotal read-only; number of total bytes for the image currently being loaded.

imagesLeftToLoad read-only; number of images that have not been fully loaded.

imageXml read-only; an XML object with image list and corresponding properties.

isPaused read-only; specfies whether the running transition has been paused.

loadImageList a list of image files (urls) to be loaded into the component.

masterList A list of MovieClip's that are shown during the slide show.

mcList a list of linkage ids for movie clips to be used as images in the slide show.

nextIndex a 0-based index of the next image to show in the list.

preloader the linkage id of a preloder to be used while loading images & swfs.

retainAspectRatio keeps original aspect ratio when displaying each image or mc.

secondsDelay number of seconds to elapse before showing the next image on the list.

sizeToFit automatically size the component to fit the image being displayed.

stockTransition a linkage id of the 'one' transition to use during the slide show.

transitionOrder can be 'sequential' or 'random'.

transitionList a list of transitions to be used during the slide show.

 

You can write ActionScript to control these and other characteristics of how the WipeTransition component displays and functions using its properties, methods, and events. Not all of these properties can be modified from the authoring interface. For more information, see WipeTransition class.

 

Creating an application with the WipeTransition component

To add a WipeTransition component to your flash document while authoring, simply drag the WipeTransition component from the Components panel onto the stage. The component is located under the flashextension.net node in the Components panel. Add some images to mcList or loadImageList properties. Test and run your movie to see the images and transitions displayed.

The WipeTransitions component uses a custom interface in the Component Inspector to let you change properties and preview transitions in a user-friendly manner. To access this interface, simply select your component instance on the stage, goto the 'Parameters' tab of the Properties panel, and then click the 'Lauch Component Inspector' button.

The Component Inspector

The following screen shots shows each of the 3 sections of the interface for the component- Settings, Images/Clips, and Transition List:

Settings

The 'Settings' section allows you to set various Boolean settings with checkboxes. It also lets you set the 'secondsDelay' property with a Numeric stepper control, and the 'transitionOrder' property with radio buttons. As soon as you change any of these properties in the interface, the WipeTransition instance on the stage is updated automatically.

The 'bgColor' property should be a hexadecimal rgb value that begins with a '#' or '0x'. The component color is updated as soon as you click away from this field.

The 'use preloader' checkbox indicates whether a default preloader should be shown when images are being loaded from disk.



Images/Clips

The 'Images/Clips' section allows you to specify image and data files to be loaded, or Movie Clips to be used in the slide show display. A browse button (with the ...) allows you to open a file dialog and browse for the desired file on your machine. The 'MovieClip linkage id's' box lets you set a list of movie clips (by their linkage identifiers) to be used. The 'image filenames' box is a list of image files that will be loaded by the WipeTransition component and displayed in the order you choose. Use the up and down arrow buttons to change the order of the images or movie clips.

Click the 'Confirm Changes' button to transfer all the changes on this section into the WipeTransition instance on the stage before exporting your movie.



Transition List

The 'Transition List' section allows you to set up transitions to be used by the WipeTransition component. Clicking on a selection previews the transition and adds it to the list to be used (the transitionList property). If 'transitionOrder' is set to '(sequential)', transitions are used in the order that you select them. Changes made to the list are automatically reflected when you export your movie.