Flash CS3 Documentation |
|||
| Programming ActionScript 3.0 > Getting started with ActionScript > Example: Creating a basic application | |||
You can create external ActionScript source files with an .as extension using Flash, Flex Builder, Dreamweaver, or any text editor.
ActionScript 3.0 can be used within a number of application development environments, including the Flash authoring and Flex Builder tools.
This section walks through the steps in creating and enhancing a simple ActionScript 3.0 application using the Flash authoring tool or the Flex Builder 2 tool. The application you'll build presents a simple pattern for using external ActionScript 3.0 class files in Flash and Flex applications. That pattern will apply to all of the other sample applications in this manual.
You should have some idea about the application you want to build before you start building it.
The representation of your design can be as simple as the name of the application and a brief statement of its purpose, or as complicated as a set of requirements documents containing numerous Unified Modeling Language (UML) diagrams. This manual doesn't discuss the discipline of software design in detail, but it's important to keep in mind that application design is an essential step in the development of ActionScript applications.
Our first example of an ActionScript application will be a standard "Hello World" application, so its design is very simple:
With that concise definition in place, you can start building the application itself.
The design statement for the Hello World application said that its code should be easy to reuse. With this goal in mind, the application uses a single object-oriented class, named Greeter, which is used from within an application that you create in Flex Builder or the Flash authoring tool.
A new ActionScript editing window is displayed.
Continue with Adding code to the Greeter class.
The Greeter class defines an object, Greeter, that you will be able to use in your HelloWorld application.
package
{
public class Greeter
{
public function sayHello():String
{
var greeting:String;
greeting = "Hello World!";
return greeting;
}
}
}
The Greeter class includes a single sayHello() method, which returns a string that says "Hello World!". <updated: 9/5/2007>
The Greeter class is now ready to be used in a Flash or Flex application.
The Greeter class that you have built defines a self-contained set of software functions, but it does not represent a complete application. To use the class, you need to create a Flash document or Flex application.
The HelloWorld application creates an new instance of the Greeter class. Here's how to attach the Greeter class to your application.
A new Flash window is displayed.
mainText as the instance name of the text field. <updated: 5/1/2007>var myGreeter:Greeter = new Greeter(); mainText.text = myGreeter.sayHello();
Continue with Publishing and testing your ActionScript application.
Software development is an iterative process. You write some code, try to compile it, and edit the code until it compiles cleanly. You run the compiled application, test it to see if it fulfills the intended design, and if it doesn't, you edit the code again until it does. The Flash and Flex Builder development environments offer a number of ways to publish, test, and debug your applications.
Here are the basic steps for testing the HelloWorld application in each environment.
You have just created a simple but complete object-oriented application that uses ActionScript 3.0. Continue with Enhancing the HelloWorld application.
To make the application a little more interesting, you'll now make it ask for and validate a user name against a predefined list of names.
First, you will update the Greeter class to add new functionality. Then you will update the Flex or Flash application to use the new functionality.
package
{
public class Greeter
{
/**
* Defines the names that should receive a proper greeting.
*/
public static var validNames:Array = ["Sammy", "Frank", "Dean"];
/**
* Builds a greeting string using the given name.
*/
public function sayHello(userName:String = ""):String
{
var greeting:String;
if (userName == "")
{
greeting = "Hello. Please type your user name, and then press the Enter key.";
}
else if (validName(userName))
{
greeting = "Hello, " + userName + ".";
}
else
{
greeting = "Sorry " + userName + ", you are not on the list.";
}
return greeting;
}
/**
* Checks whether a name is in the validNames list.
*/
public static function validName(inputName:String = ""):Boolean
{
if (validNames.indexOf(inputName) > -1)
{
return true;
}
else
{
return false;
}
}
}
}
The Greeter class now has a number of new features:
validNames array lists valid user names. The array is initialized to a list of three names when the Greeter class is loaded.sayHello() method now accepts a user name and changes the greeting based on some conditions. If the userName is an empty string (""), the greeting property is set to prompt the user for a name. If the user name is valid, the greeting becomes "Hello, userName." Finally, if either of those two conditions are not met, the greeting variable is set to "Sorry userName, you are not on the list."validName() method returns true if the inputName is found in the validNames array, and false if it is not found. The statement validNames.indexOf(inputName) checks each of the strings in the validNames array against the inputName string. The Array.indexOf() method returns the index position of the first instance of an object in an array, or the value -1 if the object is not found in the array. Next you will edit the Flash or Flex file that references this ActionScript class.
"") is passed to the Greeter class's sayHello() method:
var myGreeter:Greeter = new Greeter();
mainText.text = myGreeter.sayHello("");
mainText text field.textIn as the instance name.mainText.border = true; textIn.border = true; textIn.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed); function keyPressed(event:KeyboardEvent):void { if (event.keyCode == Keyboard.ENTER) { mainText.text = myGreeter.sayHello(textIn.text); } }
The new code adds the following functionality:
textIn field, has a set of events that it can dispatch. The addEventListener() method lets you define a function that runs when a type of event occurs. In this case, that event is the pressing of the Enter key on the keyboard.keyPressed() custom function calls the sayHello() method of the myGreeter object, passing the text from the textIn text field as a parameter. That method returns a string greeting based on the value passed in. The returned string is then assigned to the text property of the mainText text field. The complete script for Frame 1 is the following: <code updated: 6/22/2007>
mainText.border = true;
textIn.border = true;
var myGreeter:Greeter = new Greeter();
mainText.text = myGreeter.sayHello("");
textIn.addEventListener(KeyboardEvent.KEY_DOWN, keyPressed);
function keyPressed(event:KeyboardEvent):void
{
if (event.keyCode == Keyboard.ENTER)
{
mainText.text = myGreeter.sayHello(textIn.text);
}
}
When you run the application, you will be prompted to enter a user name. If it is valid (Sammy, Frank, or Dean), the application displays the "hello" confirmation message.
Flash CS3
RSS feed | Send me an e-mail when comments are added to this page | Comment Report
Current page: http://livedocs.adobe.com/flash/9.0/main/00000035.html
Comments
padrepio said on Aug 28, 2007 at 9:26 AM : texdc said on Oct 5, 2007 at 2:32 PM : try_test said on Oct 5, 2007 at 9:55 PM : No screen name said on Oct 12, 2007 at 11:23 AM : No screen name said on Oct 25, 2007 at 5:54 AM : skinnycatgide said on Nov 5, 2007 at 8:56 PM : kalibahlu said on Nov 27, 2007 at 1:29 PM : York Gibson said on Nov 29, 2007 at 8:14 AM : York Gibson said on Dec 4, 2007 at 5:36 AM : No screen name said on Dec 19, 2007 at 8:34 PM : random_ke said on Feb 5, 2008 at 2:33 PM :