Designing an Options Screen

[ LiB ]

Almost every game you create will contain an Options screen. This Options screen should be well varied and diverse. For instance, if you programmed and designed a racing game, an ideal Options screen for it should contain an option for how many laps you want your user to race, how many other vehicles you want racing with your user , the difficulty level and so on. You can base the rest of your program on these options, but to do this you have to be neat and organized because you need to keep track of variables that are affected by these options and will affect your gameeven more importantly, you have to know your Components.

Now that you're at a stage where your program can require many scenes, you should start creating new scenes for them. How? Go to the Modify menu and select the Scenes item from the GDA_PROG15.10.fla file. See Figure 15.12.

Figure 15.12. Creating new scenes

graphic/15fig12.gif


Creating new scenes allows you to create multiple timelines that help you stay organized. Each timeline is independent and you can easily jump to another scene with a gotoAndPlay or gotoAndStop command.

To create a new scene, just click on the plus sign at the bottom of the Scene pane. To delete a scene, just highlight it in the list and click on the garbage can. You can rename a scene by double-clicking on its current name on the list and typing in the new name .

Now that we got that out of the way, let me show you how I organized GDA_PROG15.10.fla. I set up two scenes. The first one is a generic splash screen of a game. It contains a button that takes you to the Options screen. Take a look at Figure 15.13.

Figure 15.13. A generic game splash screen

graphic/15fig13.gif


Once the user clicks on that button, the following code executes:

 on (release) {   gotoAndStop("Options", 1); } 

Looks a bit different, doesn't it? This version of the function allows you to input the name of the scene you want to jump to as the first parameter and the frame number of that scene as the second parameter.

Go to the Scene panel and select the Options scene from the pane. You'll instantly see the Timeline change to this scene. You should see something similar to Figure 15.14.

Figure 15.14. An Options screen layout

graphic/15fig14.gif


I have only one RadioButton group on the stage, radioGroup . Each group instance is named radio1, radio2, radio3, and radio4 respectively. You'll see why when we get to the code.

I also have three CheckBoxes on there, named check1 , check2 , and check3 , respectively.

A drop-down combo box was also added to the scene. Its instance name is weapon .

And finally, I have a button that is, allegedly, saving all of this info . In reality it's merely outputting it to the screen. The button instance is called save and the saveHandler was attached to it.

Now that you are familiar with the setup, I think you're ready for the code in saveHandler . It's nothing new but the practice is worth it.

 // Game Development with ActionScript // By Lewis Moronta (c) 2003 // Demos how to put together a form // for a game's option screen. function saveHandler(component) { if (save == component) {         // Check which player he chose.         // Loop through all possible radio buttons         // in the group and then find which one is on.         for (var i = 1; i <= 4; i++) {         // Once we find which one is selected         // we retrieve its value and display it.         if (_root["radio"+i].getState()) {               trace("Your player is " + _root["radio"+i].getValue() + "...");         }       }       // Check what weapon he chose.       trace("...and you're fighting with the " + weapon.getValue() + " weapon.");       // Check to see what cheats he wanted.       if (check1.getValue())         trace("The 50 Continues Cheat is Activated.");       if (check2.getValue())         trace("The Power Sword Cheat is Activated.");       if (check3.getValue())          trace("The Level Select Cheat is Activated.");   } } 

When the user clicks the Save button, I want all this information to be saved and displayed. The toughest, yet simplest, part of all was extracting which RadioButton was clicked and what value it contained.

The first step I took in this logic was create a loop that can loop through all four instances in that group. As I named them similar names in sequential order, I can easily reference the instances on-the-fly .

 // Loop through all possible radio buttons // in the group and then find which one is on. for (var i = 1; i <= 4; i++) { 

As I'm in a loop now, I can reference each instance with some slick ActionScripting. At the same time, I'll be checking to see if that button is the one that's checked.

 // Once we find which one is selected // we retrieve its value and display it. if (_root["radio"+i].getState()) { 

Once I found which one is the one that is selected, I output its value by using the following line:

 trace("Your player is " + _root["radio"+i].getValue() + "..."); 

I then decided to check what value was in the ComboBox under the RadioButton group. I did this by using this line:

 // Check what weapon he chose. trace("...and you're fighting with the " + weapon.getValue() + " weapon."); 

To finish off, I used conditional statements for the CheckBoxes. These statements output only if the box was checkedif it wasn't, the code ignores the option.

 // Check to see what cheats he wanted. if (check1.getValue())   trace("The 50 Continues Cheat is Activated."); if (check2.getValue())   trace("The Power Sword Cheat is Activated."); if (check3.getValue())   trace("The Level Select Cheat is Activated."); 

Does it get any easier than this?

[ LiB ]


Game Development with ActionScript
Game Development with ActionScript
ISBN: 1592001106
EAN: 2147483647
Year: 2004
Pages: 162
Authors: Lewis Moronta

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net