Flash Slideshow Tutorial

Posted: September 7, 2010 in art related, Tutorials
Tags: , , ,

This is a cool tutorial on creating a basic slideshow in Adobe Flash.  You’ll learn a some basic scripting even.

Slide Show Basics

Flash CS3

This tutorial is available on video on my website (above) it’s very basic and provides an easy template to follow if you want to create a simple slide show in flash consisting of a centred image complete with working Play and Previous buttons on either side.

Note: the dimensions and positions are from the above mentioned tutorial and are subject to change as you see fit.

SETUP

  1. size your stage to 550px by 500px with a Black Background
  2. create Four Layers – Actions, Images, Buttons and Base
  3. set Image Properties to W = 320 H = 240 Axis X = 113.0 Y = 107.0

 

LAYERS

  1. in the Image Layer insert an image in each frame until all your images are insertedBase Layer
  2. This is the layer for your frame Set Properties to W = 324 H = 111 X = 244 Y = 105
  3. Copy frame 1 of the Base layer and Paste it in the timeline to match the last image framePlay and Prev Buttons
  4. You can use Custom buttons or Wingding font # 3 and # 4 are the Play and Previous buttons Use 175 pnt for this example if you use Wingding fonts for buttons
  5. Choose Play icon and press F8 be sure button is chosen and name it Btn1
  6. Choose Prev icon and press F8 be sure button is chosen and name it Btn2
  7. In the Properties Panel give each button an instance name that matches above (Btn1 & 2)SCRIPTING

    Select Actions layer and Press F9 to open scripting window then type the following script

 

  1. stop ( )
  2.  
  3. Btn1.addEventListener(MouseEvent.CLICK,backward) ;
  4. Btn2.addEventListener(MouseEvent.CLICK,forward) ;
  5.  
  6. function forward (event:MouseEvent) {
  7. if (this.currentFrame = = this.totalFrames) {
  8. gotoAndStop (1) ;
  9. }
  10. else{
  11. nextFrame ( ) ;
  12. }
  13. }

 

  1. Copy the above script and Paste it on line 15 and change the following potions of the script
  2. on line 15 change FORWARD to BACKWARD
  3. line 16 should be changed to read >>> if (this.currentFrame = = 1) {
  4. line 20 should be changed to read >>> prevFrame
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s