Actionscript Code Hinting in Flash MX IDE
1.
Introduction
5.
Summery
We
all know Flash MX IDE supports code hinting while writing code in Action Panel. Those who do
not understand code hinting read the following paragraph, which is taken from
official Macromedia Flash MX documentation.
“Flash can detect what
action you are entering and display a code hint—a tooltip
containing the complete syntax for that action or a pop-up menu listing
possible method or property names. In expert mode, code hints appear for
parameters, properties, and events when you enter certain characters in the
Script pane. In normal mode, code hints appear for parameters and properties
(but not events) in the parameter text boxes when the Expression box is
selected. “
This figure shows how Flash detects ‘_mc’ (Movie Clip) and
displays its associated routines in a drop-down list box.
There are some default code hint
suffixes support in Flash MX IDE. See the table below.
Suffix |
Object class |
|
MovieClip |
|
Array |
|
String |
|
Button |
|
TextField |
|
TextFormat |
|
Date |
|
Sound |
|
XML |
|
XMLSocket |
|
Color |
|
Camera |
|
Microphone |
|
NetStream |
|
NetConnection |
|
SharedObject |
|
Video |
FUI Components
Set 1 (installed with Flash
MX IDE).
Suffix |
FUI Component |
|
ComboBox |
_ch |
CheckBox |
|
ListBox |
|
PushButton |
|
RadioButton |
|
ScrollPane |
FUI Components
Set 2 (Extension, needs
separate Installation)
Suffix |
FUI Component |
|
MessageBox |
|
TreeView |
|
DraggablePane |
tick_* |
Ticker |
_ib |
IconButton |
_pr |
ProgressBar |
There are many other official Macromedia FUI Components, free and commercial, which are not listed here.
For those who are
wondering how it works, I would say that it is only a two-step process. Add
relevant code-hint suffix to your variable/instance names and wait a moment for
the IDE come up with the appropriate hints. See below.
As can be seen from
the above figures, it is very simple to see code hints while writing code in
the IDE Panel. Not only does it show the
methods of the objects, but it also comes up with expected parameters.
Add relevant suffix
to identifier names and it would bring up the relevant code hints.
Alternatively,
You can see code
hints without adding suffixes also. Add
a special comment anywhere in code and immediately you would be able to see
code hint associated with the variable.
See below.
A comment is added
above of the declaration of Identifier or anywhere, which enables the code
hints for the imcBlink identifier.
imcBlink is an instance name of Movieclip object on stage.
For a string
identifier without suffix, code hint support can be enabled in the following
manner.
//ObjectClass
identifiername;
e.g.
//String
strTest;
strTest = “some string”;
In case of movieclips, we can add comments for all movieclip
instances to be used by script at the top of code.
//MovieClip
mcToolbar;
//MovieClip
mc_propertyInspector;
Code hint support would then be enabled for the identifiers
anywhere below the comments.
If you don’t like
to follow Macromedia convention for code suffixes and want your own style of
suffixes and patterns, or want to add code hint support for custom
classes/components etc., then read the following.
Macromedia Flash MX
stores all default code hints in an xml file located at following locations,
<root drive>\Documents and Settings\<user name>\ Application Data\Macromedia\Flash MX\Configuration\ActionsPanel\ AsCodeHints.xml
<root drive>
means the drive where OS is installed. In most cases, this is the C:\ drive.
If you open AsCodeHints.xml
in any text editor, you will see following structure.
<codehints>
<codehint
pattern="on (press) {\n}\n" />
<codehint
pattern="on (release) {\n}\n" />
<codehint
pattern="on (releaseOutside) {\n}\n" />
<codehint
pattern="on (rollOver) {\n}\n" />
<codehint
pattern="on (rollOut) {\n}\n" />
<codehint
pattern="on (dragOver) {\n}\n" />
<codehint
pattern="on (dragOut) {\n}\n" />
<codehint
pattern="on (keyPress "<Left>")
{\n}\n" />
<codehint
pattern="on (keyPress "<Right>")
{\n}\n" />
<codehint
pattern="on (keyPress "<Home>")
{\n}\n" />
<codehint
pattern="on (keyPress "<End>")
{\n}\n" />
<codehint
pattern="on (keyPress "<Insert>")
{\n}\n" />
<codehint
pattern="on (keyPress "<Delete>")
{\n}\n" />
<codehint
pattern="on (keyPress "<Backspace>")
{\n}\n" />
<codehint
pattern="on (keyPress "<Enter>")
{\n}\n" />
<codehint
pattern="on (keyPress "<Up>") {\n}\n"
/>
<codehint
pattern="on (keyPress "<Down>")
{\n}\n" />
<codehint
pattern="on (keyPress "<PageUp>")
{\n}\n" />
<codehint
pattern="on (keyPress "<PageDown>")
{\n}\n" />
<codehint
pattern="on (keyPress "<Tab>")
{\n}\n" />
<codehint pattern="on (keyPress
"<Escape>") {\n}\n" />
<codehint
pattern="on (keyPress "<Space>")
{\n}\n" />
<codehint
pattern="onClipEvent (load) {\n}\n" />
<codehint
pattern="onClipEvent (unload) {\n}\n" />
<codehint
pattern="onClipEvent (enterFrame) {\n}\n" />
<codehint
pattern="onClipEvent (mouseDown) {\n}\n" />
<codehint
pattern="onClipEvent (mouseMove) {\n}\n" />
<codehint
pattern="onClipEvent (mouseUp) {\n}\n" />
<codehint
pattern="onClipEvent (keyDown) {\n}\n" />
<codehint
pattern="onClipEvent (keyUp) {\n}\n" />
<codehint
pattern="onClipEvent (data) {\n}\n" />
<typeinfo pattern="*_mc"
object="MovieClip" />
<typeinfo pattern="*_array" object="Array" />
<typeinfo pattern="*_str" object="String" />
<typeinfo pattern="*_btn" object="Button" />
<typeinfo pattern="*_txt" object="TextField"
/>
<typeinfo pattern="*_fmt" object="TextFormat"
/>
<typeinfo pattern="*_date" object="Date" />
<typeinfo pattern="*_sound" object="Sound" />
<typeinfo pattern="*_xml" object="XML" />
<typeinfo pattern="*_xmlsocket" object="XMLSocket"
/>
<typeinfo pattern="*_color" object="Color" />
<typeinfo pattern="_level*" object="MovieClip"
/>
<typeinfo pattern="_parent" object="MovieClip"
/>
<typeinfo pattern="_root" object="MovieClip"
/>
</codehints>
The above xml structure is self explanatory. It includes code
hints for button, movieclip handlers. Look at those in red; these are the more
common ones that we encounter while coding.
<typeinfo pattern="*_mc"
object="MovieClip" />
If you look closely look, you
will find that *_mc means ‘anyname_mc’, which would invoke code hint. It gives
us ample room to play. If you change the pattern as below;
<typeinfo pattern="mc*"
object="MovieClip" />
save the file; restart the Flash MX IDE; and type “mc.”, you
will see the code hint like this.
You can create your own set of code hints. I had created some
for myself a long time back. I am sharing them here. Just cut and paste the
following in your existing ASCodeHints.xml file.
<typeinfo
pattern="mc*" object="MovieClip" />
<typeinfo
pattern="arr*" object="Array" />
<typeinfo
pattern="str*" object="String" />
<typeinfo
pattern="btn*" object="Button" />
<typeinfo
pattern="txt*" object="TextField" />
<typeinfo
pattern="fmt*" object="TextFormat" />
<typeinfo
pattern="date*" object="Date" />
<typeinfo
pattern="sound*" object="Sound" />
<typeinfo
pattern="xml*" object="XML" />
<typeinfo
pattern="xmlsocket*" object="XMLSocket" />
<typeinfo
pattern="color*" object="Color" />
<typeinfo
pattern="col*" object="Color" />
<typeinfo
pattern="*_dp” object=”DataProviderClass”
/>
<typeinfo
pattern="dp*” object=”DataProviderClass”
/>
Please make a
backup of the original ASCodeHints.xml before doing these changes.
If for some reason,
the backup failed, then delete the ASCodeHints.xml and restart the Flash MX.
Flash MX will recreate it with a original copy of the xml file.
I guess you are
aware that code hints can be disabled from Preferences panel.
Here, I would like
to share my personal choice of colors for syntax highlighting.
Foreground:#000000 Background:
#FFFFFF
Keyword: #0000FF Comments:
#CC0000
Identifiers: #0000FF Strings:#009933
There are more to
write on CustomActions, Custom Classes, References, and ActionPanel. Also on
how to add our own custom classes to both ActionPanel and Reference panel, to
add custom code hints, enable syntax highlighting for Custom Classes etc
I would really love
to write more on these topics, but some other time.
I just started this
document with specific purpose to share my knowledge on Code Hinting in Flash
MX ActionPanel; I have tried my best to do so. Please let me know of any error
in the document.
Author:
Website:
http://www.abdulqabiz.com
Content Edited
by: V. Subhash
Website: http://ww.domaindlx.com/vsubhash/
Date: