g Text Version
Beauty & Self
Books & Music
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
News & Politics
Religion & Spirituality
Travel & Culture
TV & Movies

Bored? Games!
Take a Quiz
Rate My Photo

Home Improvement
Women's Fashion
Small Office/Home Office
Holiday/Seasonal Cooking
Crafts for Kids

All times in EST

Clairvoyance: 08:00 PM

Full Schedule
g Flash and Animation Site

BellaOnline's Flash and Animation Editor


Customizing the Flash Preloader for SWF Template

In this tutorial, we will build a simple FlashR slideshow that will display four images. To make this project reusable, we will save this fla as a template. We will first build a basic Flash slideshow fla that has four placeholder images such as image1, image2, image3 and image4.

To use the template for any project, we can adjust the document size and replace the placeholder images with the ones supplied by the client. In preparation for this tutorial, you will need four images that have the same dimensions. For the example, I chose the dimensions 580 px by 200 px. If you would like to make the images, use the link below to read the PhotoshopR tutorial.

Our first step is to build a simple text preloader. But Flash already has a preloader template that we can use.

  1. Start a new Flash project and choose Create from Template.

  2. In the New from Template dialog box, choose Sample Files � Preloader for SWF.

    Now we have an empty fla except for the preloader. You can change the default settings to match your project requirements.

  3. From the Menubar, click Modify � Document and in the Document Settings dialog box set the dimensions to 580 x 200 pixels and white background color.

  4. Let's remove the dark gray background from the Background layer. On Frame 1, unlock the Background layer, select all the content and delete.

    Now we can see that the text and text box on the Content layer are off our stage because of the new dimensions.

  5. On Frame 1, select all content on the Content layer and drag the content to the center of the stage.

    Because the background was originally dark, It's a good guess that the text in the text box (under the "LOADING" text) is white.

  6. Click inside the text box with the Text tool. You will see the color of the text in the Properties panel. Change it from white to black.

    You may want to delete the "LOADING" text.

  7. Select just the Loading text on the first frame of the Content layer and delete.

    One final change is to remove the "Large Content Here" text from Frame 2 of the Content layer. Because of our new dimensions, this text will also be off the stage.

  8. On Frame 2 of the Content layer, select the text and delete.

  9. This step is optional but helps to keep the Flash Library organized. In the Library panel, create a folder and name it "preloader assets". Drag the loading clip and tween movieclips into this folder.

Now that we have customized the preloader to fit our project, we can build the slideshow animation.

Join us in the Digital Art and Design forum.

Add Customizing+the+Flash+Preloader+for+SWF+Template to Twitter Add Customizing+the+Flash+Preloader+for+SWF+Template to Facebook Add Customizing+the+Flash+Preloader+for+SWF+Template to MySpace Add Customizing+the+Flash+Preloader+for+SWF+Template to Del.icio.us Digg Customizing+the+Flash+Preloader+for+SWF+Template Add Customizing+the+Flash+Preloader+for+SWF+Template to Yahoo My Web Add Customizing+the+Flash+Preloader+for+SWF+Template to Google Bookmarks Add Customizing+the+Flash+Preloader+for+SWF+Template to Stumbleupon Add Customizing+the+Flash+Preloader+for+SWF+Template to Reddit


RSS | Related Articles | Editor's Picks Articles | Top Ten Articles | Previous Features | Site Map

For FREE email updates, subscribe to the Flash and Animation Newsletter

Past Issues

Printer Friendly
tell friend
Tell a Friend
Email Editor

Content copyright © 2015 by Diane Cipollo. All rights reserved.
This content was written by Diane Cipollo. If you wish to use this content in any manner, you need written permission. Contact Diane Cipollo for details.


g features
Animation Software Terms

Why Hype 3.5 and Pro

Tumult Hype and Pro Intro

Archives | Site Map


Past Issues

Less than Monthly

BellaOnline on Facebook

| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2015 Minerva WebWorks LLC. All rights reserved.

BellaOnline Editor