Simple Links

Note: Don't get Flash 'frames' mixed up with HTML 'frames'. They are completely different. Confused already? Well actually is is not difficult (hopefully)!

Cross Ref: If you wish to learn how to make a hyperlink, a link from a Flash movie to a new web page, go to the beginners tutorial: Hyperlinks

1. Go to: File > New > General Tab > Flash Document > OK

Note: The work space in Flash is often quite cluttered with Panels. Panels are tool boxes and although useful - much of the time time you don't need them and I think for beginners they are confusing. For this reason we are going to close then all except for the Timeline and Tools. You can turn these Panels off and On in the Windows Menu.



Only the Timeline and Tools are open.

Note: You should also close all the Panels that you will find in the sub menus. The sub menus can be accessed via the little triangles:


2. We are now ready to customise the document. Go to: Modify > Document.
3. Type in the dimensions that you want for your movie. The one above is 200 x 130 px (pixels).
4. Select a background colour by clicking on the coloured swatch.
5. Click: OK.
6. Save your file

Your Document Properties should look like this.

1. Using the Text Tool on the tool bar type: 'Page One' on the stage. The stage is the visible 'page'.
2. When you have finished typing go back to the Selection tool .
3. If you want to change the colour, style or size of the font you can do so in the Property Inspector: Window > Properties
   
   Note: If you want to change the type settings the text must be selected. If you click on your text with the Selection Tool the text will have a blue rectangle around it:




4. Go to: Windows > Other Panels > Common Libraries > Buttons.
   To look at the buttons you need to double click on the folders . Choose a button and drag it out on to the stage. I selected: Circle Buttons > Circle Button - Next. You can move the position of the button by clicking on it with the Selection Tool and dragging it.
   
   Note: If you take a different button from the Common Button Library avoid Knobs, Faders and Component buttons as they work differently.


5. Place anything else that you may want on the first frame. You can draw with some of the tools on the tool bar or copy and paste clip art from other programs such as Word. You can also paste from graphics programs like Freehand, Illustrator or CorelDraw.
6. Save your file.

1. Go to the Timeline and place your cursor in frame 2. Right click (Ctrl click on a Mac) and select: Insert Keyframe
   You will now have a black dot in both frames 1 and 2. This copies all the contents from frame one and places them onto frame 2. It is the same as copy and paste. Your stage should look the same as before you clicked in frame two but now you are actually in a different place in the movie. The red play head should now be in frame two:



Two black dots in the timeline represent the Keyframe's.


2. Use your Text Tool to over write the word 'one' and type 'two'. It should now say: Page two
3. When you have finished typing reselect the Selection Tool:
4. Go back to the Common Button Library (Windows > Other Panels > Common Libraries > Buttons) and select a button as the back button and drag it onto the stage.
5. Click on the back dot in frame 1 and you will see that the difference between the two frames.
6. Click on the black dot (called a keyframe) in frame 2 and add any additional graphic and text elements that you may want.
7. Save your file.

1. Right click in frame 3 and select select: Insert Keyframe
2. Make any changes to fram e 3 as you did for frame 2.
3. Save your file.

1. Time to test your movie. Go to: Control > Test Movie
   
   Note: This takes you to a new window. Your movie should be jumping from frame to frame non stop. You should be able to see a clear difference between all three frames.


2. Close the window. You do this by clicking on the lower of the two crosses in the top right hand corner of your screen. This will not close your file but only the test window.

1. Welcome to ActionScript. Your first bit of programming! You need to select frame 1 (the first frame with a black dot in it): Click on key frame 1
2. Open the Actions Panel. On the keyboard press: F9
   
   Important: If you have selected the Frame correctly the Actions panel should say Actions - Frame. Beware it is easy to attach your Actions to the wrong thing! Get in the habit of checking the top of the Actions panel before you use it.



Always check what it says in the top left corner of the Actions Panel.


3. Click on the: Plus Sign > Global Functions > Timeline Control > Stop
   Your Actions Panel should display the following ActionScript:
   
   

   stop();

   
   
4. Close the Actions Panel - on the keyboard press: F9
   
   Note: A small a should appear above the black dot in frame one. This indicates that the key frame has some Actionscript attached to it.
   
   
   

   Note the little 'a' in frame 1.
   
   
5. Test your movie:Control > Test Movie
   Your movie should be stopped on frame one.
6. Close the test Window.
7. Save your file.

1. In the timeline, if you are not already on frame 1, drag the red Play Head to: Frame 1
2. On the stage select the: Button
3. Open the Actions Panel - on the keyboard press: F9
   
   Important: If you have selected the button correctly the Actions panel should say Actions - Button in the top corner:
   



Always check what it says in the top left corner of the Actions Panel.


4. Type the following code into the Actions Panel:
   
   

   on (release) { gotoAndStop(2); }

   
   This means that when the mouse button is released you will go to frame 2 and stop.

1. Time to test again. Go to: Control > Test Movie
2. Click on your button. You should move to frame 2.
3. Close the test Window by clicking on the cross:

on (release) {
  gotoAndStop(1);
}

on (release) {
  gotoAndStop(3);
}