Create a Quiz Application Using AS3 Classes
This article has been added to your 'Articles to Read' list.
Create the files and the file structure
Open flash, and create a new Actionscript file. We're going to first create QuizApp.as, which will be our Document Class. So type these lines into the script pane:
package {
import flash.display.Sprite;
public class QuizApp extends Sprite {
public function QuizApp() {
trace("this is the document class");
}
}
}
Go to File, Save. You can use this dialog box to also create your folder. I'll assume that you know how to browse your system to get to the place where you keep your flash files. Create a new folder there to save this file into (I named my folder "Quiz"), then save it there as QuizApp.as.
Notice that every class file must include the package keyword. In this case, we're not saving into a package, so the package keyword appears without anything following it. This is called using the unnamed package. Our class files will still be able to find each other without importing, because we're saving them all into the same folder. Flash's classpath always includes a reference to the current folder.
Any class file that you want to use as a Document Class must extend either MovieClip or Sprite. The difference is whether you intend to use the main timeline or not. If so, use MovieClip, and if not, use Sprite. In this case, we will just choose to extend Sprite, because everything we create will be generated with Actionscript. We won't be physically placing any objects on the timeline at authoring time.
Next, create a new flash file. Immediately save it to the same folder where you saved QuizApp.as. I named mine "Quiz.fla." We're not done working with this file yet, but we need to save it right away, so that when we designate the Document Class, flash will find our QuizApp class file. So make sure you save the file before proceeding.
Next, here's how to designate the Document Class: Click somewhere on or around the stage, so that the Properties Panel gives you the properties of the Document. It should say "Document" in the upper left corner of the Properties Panel. Look for the field labelled "Document Class," and type "QuizApp" into that field (minus the quotes, of course, and make sure you don't include the .as file extension):
Press the Enter key. You shouldn't get any dialog box warning you that the class file couldn't be found. You would have gotten such a warning if you had not already saved this fla file somewhere. If you do get the warning dialog, something is wrong, and you should check to make sure you really saved both files to the same folder. Also make sure that all spelling and capitalization is correct everywhere, as flash is case sensitive.
Press CTRL-Enter to test the movie. You should get this message in the output window: "this is the document class." This means our Document Class is working. It's being automatically instantiated when the fla is compiled. It's also being added to the stage with an automatic "addChild" command that happens behind the scenes. This isn't apparent at the moment, because it doesn't contain any graphical content yet. But if it did, you'd see it appear. So, anything we add to this Document Class with addChild will also appear on the stage of our movie.
There's a little more we have to do with our fla file before we leave it. Go to the Components panel (if it's not around anywhere, go to Window, Components, or just press CTRL-F7). Drag the Button component out to the stage area, then press the Delete key. Next, drag the RadioButton component out to the stage, and again press the Delete key. This has the effect of adding these items to your fla file's library. The idea here is that we can create instances of these components with Actionscript code, but not unless their master templates are also in our library, as they contain all the graphics.
Now the fla file is done. All of our coding is going to be done inside the two class files. Let's create the other class file, QuizQuestion:
Go to File, New, and create a new Actionscript file. Type the following code into the script pane:
package {
import flash.display.Sprite;
public class QuizQuestion extends Sprite {
public function QuizQuestion() {
}
}
}
Save the file as QuizQuestion.as, in the same folder where you've saved the other two files. Now all the files are created, and they all reside in the same folder. Our Document Class is working, and we can now proceed to flesh out our class files some more.
