You know that you can add ActionScript to your Flash application, but you might wonder how you add it. There is a panel, called the Actions panel, for just that purpose.
The Actions panel allows you to view or edit the code on anything that you have selected. If you have a frame selected, the Actions panel shows you the code that is on that frame and lets you edit code on that frame. If you have a symbol on the stage selected, such as a button or a movie clip, the Actions panel allows you to view/edit the code that is on this symbol. A later section in this lesson, called "Code Placement," discusses in greater detail where you can add code in your application.
Launching the Actions Panel
The Actions panel can be opened in three ways.
Many people prefer to undock the Actions panel so that it can be easily dragged around as needed. You can do this by clicking and dragging the panel by its gripper, which is the small area just to the left of the panel title Actions. Just drag the gripper onto the Stage area until you see a ghosted image of the panel appear to be undocked, and then release.
The Actions panel is made up of several pieces shown in the screen shot. They are explained in the following sections.
The Script pane is where you manage ActionScript. If a frame is selected and there is code on that frame, it can be viewed and edited through the Script pane. You can select another frame that does not yet contain ActionScript and then add ActionScript to it.
In this image, Frame 1 in the actions layer is selected. That frame contains some ActionScript, so it is visible in the Script pane of the Actions panel.
The Actions panel toolbar is found at the top of the Actions panel. It contains several buttons that can be useful while writing and debugging ActionScript. We'll briefly cover them here.
Add a New Item to the Script
This button provides a way for you to add pieces of ActionScript into the Script pane without having to remember exactly how to type it. You'll see this in action, along with the Script Assist option, in the exercise at the end of this section.
This button launches a search window. You can search your ActionScript to find certain words or variables. You can also use this window to find and replace one grouping of characters for another! As a developer of ActionScript, you'll find that this tool comes in quite handy.
If you have programmed using improper syntax, when you test or publish, you will be informed of a syntax error. If you want to check for syntax errors before publishing, just click the Check Syntax button. It checks the syntax of the currently selected script. If it finds errors, you'll be informed. The Output panel appears and displays an error message.
Formatting your code with tabs, carriage returns, and spaces is considered by many to be a good practice. It makes your code more easily readable. If you would like to have Flash search through your currently selected script and auto format it by placing tabs, carriage returns, and spaces where it thinks is best, then click this button.
Insert a Target Path
When you want to use code to control a symbol, you must refer to its instance name. You can type in the path to this symbol instance or you can use this button to launch a window to help you do this visually. This window allows you to navigate to the symbol of interest and to select that symbol. Once you have selected the symbol, the target path is automatically inserted for you.
Show Code Hint
Code hints help you easily select from a list of methods and properties of a class instance stored in a variable. They are discussed briefly in the section on creating variables.
The Actions panel allows you to set a breakpoint in code. A breakpoint helps you when you are trying to debug your application. With this toolbar option, you can set a breakpoint, remove a breakpoint, and remove all breakpoints.
By default, you add code to the Actions panel by typing it in. If you click the Script Assist button, the Actions panel no longer lets you manually enter code into the Script pane. You edit code another way. This is discussed in greater detail as follows and in the exercise at the end of this section.
This button is used to launch the Help panel. If something is highlighted in the Actions toolbox area of the Actions panel when this button is clicked, help for that item is displayed. The Help panel is a very useful tool.
There is a menu button found on the far right of the toolbar. If you click it, you see a long list of options, many of which are also represented in the toolbar.
Here are a few of the other options and what they do:
This option allows you to browse to a text file that contains ActionScript. This script is then loaded and added to the Script pane.
This option allows you to easily save the script currently showing in the Script pane to a text file.
If selected, line numbers show in the Script pane to the left of each line of code. This can come in handy when you are communicating with another programmer about the ActionScript or if you just like to know how many lines of code you write.
Sometimes lines of ActionScript can be quite long, extending wider than the visible area of the Script pane. If you don't want to have to scroll horizontally to be able to read that line of code, you can select Word Wrap. The entire script is then word-wrapped into the visible area in the Script pane.
Selecting this option launches a new window that allows you to configure ActionScript preferences. Keywords, comments, and other special cases are colored in the Script pane. You can customize these colors as well as the preferred font and font size. In addition, you can also customize how the ActionScript is autoformatted.
The Actions toolbox is found in the upper-left corner of the Actions panel. It contains a highly organized list of all built-in functions; classes; and the methods, properties, and events of those classes. We'll look into this a bit more in Lesson 5, "Built-in Classes."
A drop-down list at the top of the Actions toolbox lets you select which version(s) of ActionScript you want to appear in the list. By default, it is set to display ActionScript 1.0 and ActionScript 2.0.
The Actions toolbox is used as an easy way for you to drill down to find what ActionScript is available for specific classes. It can be used to add code to the Script pane by double-clicking an action. I personally use it the most to highlight a specific action and then get help on that action by clicking the Reference button in the toolbar.
In some Flash files, ActionScript is placed in a number of areas. If it is your job to open such a file and edit the ActionScript, you might find it difficult to locate exactly where the ActionScript exists. The Script navigator, found in the bottom-left area of the Actions panel, helps you see at a glance where code exists.
The Script navigator shows you a tree view of the elements that contain ActionScript in your current file. You can click anything in that tree to view/edit the code that is attached to it. The previous image shows a frame that contains some ActionScript and a button that contains some ActionScript. In the Script navigator, you can see that both Frame 1 and home page button appear. If you click home page button, you would see the ActionScript on that button.
The default setting for the Actions panel allows you to type all of the ActionScript that you need right into the Script pane. If you are new to programming, remembering all the syntax rules can be daunting. There is an alternative to writing code manually: Script Assist.
The Actions panel is switched to Script Assist mode by clicking the Script Assist button. This mode helps you to add ActionScript in an easy way so that you don't have to worry about the syntax or formatting rules. Using the Add a New Item to the Script button in the Actions panel toolbar, you can add lines of code. Script Assist then gives you fields to fill out to customize the script.
To create a new variable using the Add a New Item to the Script button, select Statements > Variables > var. A blank variable template appears in the Script pane with fields to fill out above the Script pane.
The first field is called Variables. Type the name of the variable, an equal sign, and the value of that variable. On the next line, you'll find a field called Type. You can type the name of the data type or you can find it in the drop-down list. To add a second variable, follow the same process. The Script Assist tool helps you by enforcing proper syntax and formatting.
You've now been formally introduced to the Actions panel. The various areas on the panel as well as its buttons have been explained. So now, it's time to use it! In this exercise, you use Script Assist to add ActionScript to a frame.