Using Actionscript

As well as adding pages using the component inspector as described in the Basic tutorial and with XML as described in the Using XML tutorial you can also add pages with Actionscript. This tutorial decribes how.

1) Before you begin this tutorial you will need to gather together some images you wish to use. For the purposes of this tutorial save three images as 'img1.jpg', 'img2.jpg' and 'img3.jpg' in a single folder.

2) Open Flash and create a new file. If you wish to publish for Actionscript 2 start a new Actionscript 2 file, if you wish to publish for Actionscript 3 start a new Actionscript 3 file. Save it in the same folder as your images.

3) Open the component panel, locate the flipNavigation folder and drag a copy of the flipNavigation component onto the stage. Give it the instance name 'flipNav' (without the quotes).

4) Create a new layer, select the keyframe and open the Actions panel.

5) In the Actions panel enter the following code

var page1:Object = {id:"img1", url:"img1.jpg", type:"horizontal"};

This code creates an object which contains three properties. The id property is the ID of the image, the url property is the location of the image and the type property specifies the effect.

Next, you need to add a line which adds the object to the component, if you are publishing for Actionscript 2 you need to use the addItem method like so:

flipNav.addItem(page1);

Alternately if you are publishing for Actionscript 3 you need to use the addPage method like so:

flipNav.addPage(page1);

Repeat these steps for each item you wish to add.

If you are publishing for Actionscript 2 your complete script should look something like this:

var page1:Object = {id:"img1", url:"img1.jpg", type:"horizontal"};
var page2:Object = {id:"img2", url:"img2.jpg", type:"horizontal"};
var page3:Object = {id:"img3", url:"img3.jpg", type:"horizontal"};
flipNav.addItem(page1);
flipNav.addItem(page2);
flipNav.addItem(page3);

Alternately if you are publishing for Actionscript 3 your complete script should look something like this:

var page1:Object = {id:"img1", url:"img1.jpg", type:"horizontal"};
var page2:Object = {id:"img2", url:"img2.jpg", type:"horizontal"};
var page3:Object = {id:"img3", url:"img3.jpg", type:"horizontal"};
flipNav.addPage(page1);
flipNav.addPage(page2);
flipNav.addPage(page3);

6) If you wish you can now add a menu by following steps 6 and 7 of the basic tutorial.

7) Save your file in the same folder as your images.