Unit 04 - Slide Show
iTunes U Unit 04 Training Videos
Loading the first slide
An easy way to dynamically load external images into a Flash movie is to use the UILoader which can be found under Window > Componets. You can give it an instance name and then load images using the code below.
imageLoader.source="images/slide_0.jpg";
Loading the total number variable
- Next create a variable that will keep track of what the current slide is.
- var CurImgNum:Number=0;
- Flash starts counting from 0
- Next, use your UILoader to load the .jpg, .png, .swf, etc. slide. In this case, the URL contains the string indicating the folder/file name. We then concatenate the current number and .jpg extension and load it into our movie
imageLoader.source="images/slide_" + CurImgNum +".jpg";
Loading the total slides variable
- Create a variable to indicate the total number of slides
- TotalImgNum:Number=10;
- This creates a variable that indicates the total number of slides so that when the slides are done they can start over
Adding the next button functionality - Use with video training
- Set up an EventListener
- next_btn.addEventListener(MouseEvent.CLICK, nextImg);
Declare the nextImg function and add an if else statement.
- function nextImg(evtObj:MouseEvent):void {
if (CurImgNum<TotalImgNum-1) {
trace("under total");
CurImgNum++;
trace(CurImgNum);
trace(TotalImgNum);
imageLoader.source="images/slide_" + CurImgNum +".jpg";
} else {
CurImgNum = 0;
trace("over total");
trace(CurImgNum);
trace(TotalImgNum);
imageLoader.source="images/slide_" + CurImgNum +".jpg";
}
Adding the previous slide functionality
See if you can figure out the logic. It is very similar to the next slide button.
back_btn.addEventListener(MouseEvent.CLICK, backImg);
function backImg(evtObj:MouseEvent):void {
if (CurImgNum > 0) {
trace("under total");
CurImgNum--;
trace(CurImgNum);
trace(TotalImgNum);
imageLoader.source="images/slide_" + CurImgNum +".jpg";
} else {
CurImgNum = 9;
trace("over total");
trace(CurImgNum);
trace(TotalImgNum);
imageLoader.source="images/slide_" + CurImgNum +".jpg";
}