Visit SlideShowPro.net  Community Forums
SlideShowPro Help Wiki
  

SlideShowPro for Flash

How to: External captions

Note: A demo FLA for this how-to is available for SlideShowPro for Flash users. Download here.

The first step is to add a component instance to your Stage. Open the "Components" panel, drag a copy of SlideShowPro in, then assign it an instance name of "my_ssp" in the Properties panel. Next, create a text field on the Stage, and make it a "Dynamic Text" field in the drop-down inside the Properties panel. Give it an instance name of "t_txt".

With that done, we need to add some ActionScript to the movie. Create a new timeline layer in your FLA, click in the first empty keyframe, and open the "Actions" panel. If you are using the ActionScript 2 version of SlideShowPro, enter the following:

var sspListener = new Object();

sspListener.onImageData = function(eventObject):Void { 	
   t_txt.htmlText = eventObject.data.caption;
}

my_ssp.addEventListener("onImageData", sspListener);

If you are using the ActionScript 3 version of SlideShowPro, enter this instead:

import net.slideshowpro.slideshowpro.*;

function onImageData(event:SSPDataEvent) {
	if (event.type=="imageData") {
		t_txt.htmlText=event.data.caption;
	}
}

my_ssp.addEventListener(SSPDataEvent.IMAGE_DATA, onImageData);

Each time the image / video changes, the external text field will be rewritten with the corresponding caption.

Here's another example that only displays your external text field on rollover. If you are using the ActionScript 2 version, the code would look like this:

var sspListener = new Object();

t_txt._visible = false;

sspListener.onImageData = function(eventObject):Void {
    t_txt.htmlText = eventObject.data.caption;
}

sspListener.onImageRoll = function(eventObject):Void {
    if (eventObject.data == "over") {
        t_txt._visible = true;
    } else {
        t_txt._visible = false;
    }
}

my_ssp.addEventListener("onImageData", sspListener);
my_ssp.addEventListener("onImageRoll", sspListener);

In ActionScript 3...

import net.slideshowpro.slideshowpro.*;

t_txt.visible = false;

function onImageData(event:SSPDataEvent) {
	if (event.type=="imageData") {
		t_txt.htmlText=event.data.caption;
	}
}

function onImageEvent(event:SSPImageEvent) {
	if (event.type == "imageRollOver") {
		t_txt.visible = true;
	} else {
		t_txt.visible = false;
	}
}

my_ssp.addEventListener(SSPDataEvent.IMAGE_DATA, onImageData);
my_ssp.addEventListener(SSPImageEvent.IMAGE_ROLLOVER, onImageEvent);
my_ssp.addEventListener(SSPImageEvent.IMAGE_ROLLOUT, onImageEvent);

Your caption text field should now show on image/video rollover, and disappear when rolling-out.

Page last modified by tdominey on October 26, 2008, at 05:29 PM
© 2010 Dominey Design Inc. All Rights Reserved.
About | Merchandise | Contact | Privacy policy | Legal | Licensing