Thursday, December 9, 2010

Create a simple slideshow using AS3: Part 1

Today we will make a very simple slideshow.

This method is really simple and can be used effectively in your flash applications.

Firstly, create a movieclip and place it on stage. Make as many frames in it as you wish, where each frame contains one picture. Give the movieclip name of "gallery" on stage, and add this code:

import flash.utils.Timer;

gallery.stop();

var changeTimer:Timer = new Timer(2000);
changeTimer.addEventListener(TimerEvent.TIMER, updateSlideshow);
changeTimer.start();

function updateSlideshow(TimerEvent):void
{
if (gallery.currentFrame < gallery.totalFrames)
{
gallery.gotoAndStop(gallery.currentFrame+1);
}
else if (gallery.currentFrame == gallery.totalFrames)
{
gallery.gotoAndStop(1);
}
}

This code creates a timer that will update the MovieClip every 2 seconds (you can change the time). The code makes sure that if we have reached the last frame of our movieclip, then go back to the first frame.

The advantage of using this method is that if you need to add more pictures, you just add them as new frames - no changes need to be made to the code. The disadvantage might be not so fancy slide show effect, but we will improve it in the next part.


Thanks for reading!

Related:

Create a simple slideshow using AS3: Part 2
Create a simple slideshow using AS3: Part 3
Create a simple slideshow using AS3: Part 4
Create a simple slideshow using AS3: Part 5
Create a simple slideshow using AS3: Part 6
Create a simple slideshow using AS3: Part 7
Create a simple slideshow using AS3: Part 8
Create a simple slideshow using AS3: Part 9
Create a simple slideshow using AS3: Part 10

4 comments:

Anonymous said...

Thanks!

Anonymous said...

hi kirill,
just tried to sign up using a google account, but this disabled commenting.
so i have to leave an email address here.
i followed your steps above to create a simple slideshow, but it doesnt work. do i need to add extra code somewhere? am i not applying the code in the right spot? i tried to put it on the first frame of the gallery movieclip on the first frame. also tried the first frame on a second layer.
and also tried to put it on the first frame of scene 1.
please advise.
roma_pas@hotmail.com

Anonymous said...

okay, i somehow it's working now! thanks for this tutorial!
the code needs to be in frame 1 of the scene. on the filled frame itself.
could you delete my former message because my emailaddress is in it?

still the last one slideshow part 10 is not working properly yet.
maybe because i need to know the height of the pictures.
or because i didnt set the x and y orientation of the movieclips properly.

Anonymous said...

well, maybe i was too quick to say it was functioning....
when i use the code for slideshow part 2 it keeps showing a glitch of slide 2 with every fade.
please advise ; )

Post a Comment