Recipe 12.9. Building an Image Slideshow Using the Flash 8 Cookbook Components

Problem

You want to build a slideshow that uses a Flash 8 Cookbook component.

Solution

Use a Presentation component to create a slideshow based on images you import into Flash during authoring time.

Use a SlideShow component to create a slideshow based on external image files that are loaded at runtime.

Discussion

You can use the Presentation component that is discussed in previous recipes in this chapter to create a photo slideshow. To do so, follow the same directions as when creating a standard presentation, using imported images as the contents for each screen. If you want the slideshow to play back automatically without the user having to press buttons, you can set the Presentation component instance's timer parameter to a positive numeric value indicating the number of seconds between each image.

The SlideShow component provides slightly different way to create a slideshow. Instead of having to import your images, arrange then in Flash, and so on, you can actually tell Flash to load the images as the movie runs. In order to understand the information, the component needs you to provide the information about the images in an XML document. Even if you've not used XML before, it is still very simple to learn and apply to this task. The following is an example of an XML document that will work with the SlideShow component to create a slideshow with four images:

 <images>   <image url="one.jpg />   <image url="two.jpg" />   <image url="three.jpg" />   <image url="four.jpg" /> </images> 

The outermost XML tag (<images> in the example) is called the root element. XML documents that will work with the SlideShow component should have a single root element that contains nested elements for each of the images in the slideshow. The nested elements (<image> in the example) should each have an attribute named url that has a value indicating the name and location of the JPEG to load. The value can be a relative URL (as in the example) or an absolute URL (such as http://www.person13.com/image.jpg).

You can create an XML document using any editor that will save a text file without any special formatting. For example, WordPad on Windows will work just fine. You can also use more sophisticated editors such as BBEdit, PrimalScript, or Dreamweaver to create your XML documents if you prefer. Because the XML document you are creating is really quite simple, no particular editor is likely to offer significant advantages over the others.

When you've defined your XML document and saved it, tell Flash to use that information with a SlideShow component instance. After creating a SlideShow instance on the stage, set the xmlURL parameter to point to the XML document that you have just created. The simplest thing to do is to save the Flash files, XML document, and images all to the same directory. Then set the xmlURL parameter to the name of the XML document. For example, if you have created an XML document named images.xml within the same directory as your Flash files, you can set the xmlURL parameter for the SlideShow component to images.xml. It is also possible to use an absolute URL, such as http://www.person13.com/images.xml.

Set the timer parameter for the SlideShow component to a positive numeric value indicating the number of seconds between each image in the slideshow. You can also select from a list of available transitions.

The images for the slideshow load into the SlideShow component instance. That means that if you scale and/or move the SlideShow instance, the images will all be affected in a like manner. If you want to add a background to your slideshow, add artwork to a layer below the layer in which you have placed the SlideShow instance. If you want to add a frame or any other artwork that should appear over the images, place that artwork in a layer above the layer in which you have placed the SlideShow instance.

After you've created the XML document and set the parameters of the SlideShow component instance, you can test the movie. You should see the slideshow run automatically. When you transfer your application, make sure that you include all the necessary files. If you've used relative URLs when specifying where Flash can find the XML document or the images, make sure you include those files along with the .swf file.