Creating a multiple choice quiz
In this tutorial you will learn how to create a toggle button that changes state when the user clicks on it. It's not actually a button at all - but the user won't know that. :)
This tutorial assumes that you can use the basic drawing tools and perform basic tasks such as create new layers and keyframes.
Each step in this tutorial will show a summary of each step in bold followed by a more detailed explanation.
Getting started
Start with a new flash document. Your quiz is going to have three sections as shown in the diagram below:
You will need one keyframe for the start (the introduction of the quiz). You will need at least one keyframe for each question of your quiz and you will need a keyframe for the end of the quiz when the final score is displayed.
1 : Create the the introduction for your quiz
Summary : Rename the only existing layer to "Background".
This layer will be used as a background for the entire quiz. To rename it, double click on the existing name of the layer.
Once you've done that, create a suitable background on the stage that will be suitable for the introduction, the questions and the final score display.
For my demonstration quiz I've created a design that has a space at the top for a title, space in the middle for the content of each section and a bar at the bottom for progression buttons.
I'll leave it up to you to come up with your own design - this tutorial isn't about the basic drawing tools. 
Because you're not going to change the background layer you might as well lock it (to prevent you accidentally changing it later).
2 : Create the content layer
Summary : Create a new layer and rename it to "Content".
Because the content is going to change for each section of your quiz it's probably a good idea to create a special layer for the content.
I've just clicked on the new layer icon, double clicked on the default layer title and renamed it to Content.
3 : Create the buttons layer
Summary : Create a new layer and rename it to "Buttons".
Each of my quiz questions will have four possible answers but, to make life easier for myself, I'm going to use the same four buttons for all the questions! I'll need a seperate layer for my quiz answer buttons.
4 : Create the script layer
Summary : Create the a new layer and rename it to 'Script'.
It's always a good idea to keep all your actionscript that exists in frame on the same layer - this makes it much easier to find later. Yes, I know a frame with Actionscript gets a little 'a' in it but they're still easier to find if they're all on the same layer.
5 : Create the content for the quiz introduction
Summary : Create a suitable introduction for your quiz on the Content layer
Select the first keyframe on the Content layer (it should be frame 1 - you won't have any other frames on the Content layer yet). On the stage, create a suitable introduction to your quiz.
This might just be text, it might be graphics - it's up to you.
6 : Create the initialisation Actionscript
Summary : Add the ActionScript to frame 1 of the script layer.
Right-click on the first keyframe on the Script layer and select Actions. (Or you could click on the frame and open the Actions panel yourself - it's usually just above the properties panel).
Enter the following code in the Actions panel. The comments explain what each line of script is doing.
// Create a variable to store the score
var score = 0;
// Stop the movie on the introduction frame
stop();
7 : Create a button to start the quiz
Summary : Create a button on the Content layer to start the quiz.
Select the keyframe on the Content layer and create a button on the stage. The user will click on this button to start the quiz so label it appropriately.
I've labelled mine, "Start" and placed it at the bottom-right corner of my quiz.
8 : Edit the actions for the Start button
Summary : Add the ActionScript for the Start button.
Right-click on the Start button and select Actions (or select the Start button and open the Actions panel).
The only thing that you need this button to do is start the movie moving towards the next frame. Here's the code for the button actions:
on(release){
// Start the movie playing
play();
}
9 : Create the keyframes for the first question
Summary : Create blank keyframes on the Script and Content layers. Extend the background layer by adding a frame.
Create a blank keyframe on the Script layer.
Create another blank keyframe on the Content layer.
If you insert a normal keyframe instead of a blank keyframe, the content of the previous keyframe (the quiz introduction) will be copied into the new keyframe. You don't want to do that.
Create a new frame (not a keyframe) on the background layer so that the background you created in frame 1 is extended into frame 2.
10 : Write the question and possible answers on the content layer
Summary : Add the content for question 1 to the Content layer.
Select the new keyframe that you just created on the Content layer.
Write a question that you can create four possible answers for.
Leaving space for the toggle buttons, create four possible answers for the question.
The image to the right shows my first question so far. I still need to create the answer buttons and also a button that the user can click to indicate that they're ready to move on to the next question.
11 : Create the toggle button
Make sure that the Buttons layer is selected.
Using the rectangle tool, draw a rectangle to your liking next to the first question. If your prefer, this could be a circle, a star or whatever shape you wish.
Double-click the centre of the new shape to make sure that the fill and the outline is selected.
Right-click on the centre of the shape and choose Convert to Symbol.
As shown in the image to the right, make sure that you select Movie Clip as the type and give it a sensible name. I've called mine movToggleButton.
Press OK to confirm the symbol creation.
Edit the new toggle button symbol
Double click on the shape that you just turned into a symbol. This will open up the symbol for editing.
There will currently only be one layer (Layer 1). Rename Layer 1 to Background.
Add a new layer above the background layer and call it Script.
Add the initialisation script to the symbol
Select the first keyframe on the Script layer and add the following code:
var toggle = false;
stop();
This script creates a variable called toggle and sets it to false. It also stops the toggle button from moving onto the next frame (which will be the 'on' state of the toggle button).
Create the on-state for the button
Add the code for the 'on' state.
Add a keyframe to frame 2 of the Script layer. In that new keyframe add the following code:
toggle = true;
stop();
This code will change the value of the toggle variable to true and stop the movie from looping back to frame 1 (the 'off' state of the toggle button).
Change the fill colour for the 'on' state.
Insert a key-frame on frame 2 of the Background layer. This will duplicate the shape that represents your button from frame 1.
Select the fill of the shape and change it to a different colour to show the user that its state has changed. You could also draw a tick mark on it if you feel that you make the selected state clearer.
Return to Scene 1
You've now completed the toggle button so click on Scene 1 on the bread-crumb trail to finish editing the symbol.
Duplicate the toggle button for each question
Make sure the toggle symbol is currently selected on the state then copy it using Ctrl+C. Now press Ctrl+Shift+V to place the copy in the same place as the original.
Using the down arrow cursor key, move the copy of the button down so it's next to the second question.
Press Ctrl+Shift+V to paste the copy in place again and move it down next to the third question.
Press Ctrl+Shift+V one more time and move the copy down next to the fourth question.
[Still to come : How to make the toggle buttons activate when they're clicked.]