Flex best practices – Part 2: Development practices

Best practices for formatting

Organize ActionScript classes

Keep ActionScript classes organized and arranged in a way that is consistent with the rest of the source code throughout your application. This will help later when you or another developer needs to locate a particular area of the code to make a quick change.

You can use the following structure as an example:

1. Initial comment. (Author, version, copyright, code license, and so on).
2. Package declaration
3. Import statements
4. Class-level metadata tags: Event, Style, Effect (with comments!)
5. Class or interface implementation ASDoc comment
6. Class or interface statement

7. Static variables

   1. Public
   2. Protected
   3. Private

8. Instance variables

      
   1. Public
   2. Protected
   3. Private
9. Constructor
10. Getter/setter methods (with backing variables)
11. Methods, grouped according to functionality

Indent each new block of code by four spaces

Set your editor to insert spaces instead of tabs when you press the Tab key. This will help avoid cross platform source code display and readability issues. Tabs are displayed differently on different operating systems.

Separate each method in a class with a blank line

Create each method with an ASDoc documentation comment directly above the method. Follow this with the method signature with typed arguments, if arguments are present, then the method body, and finally a blank line.

Use spaces to improve code readability

In general use one space after commas. Use spaces before and after operators such as + and -.

 

MXML coding standards

To help maintain consistency and order, use the following practices when authoring or editing MXML source code in a Flex application.

Best practices for elements

Organize element attributes

Order the element attributes: property, events, effects, styles.

Place the ID attribute as the first attribute

For example: <mx:Button id ="thisButton" />

Group associated attributes together on one line

For example: paddingLeft, paddingRight, x, y, etc.

Group related attributes

If there are more associated attributes than will fit on one line, then use an additional line but keep the related attributes together as best as possible.

Best practices for formatting

Use blank lines to organize MXML

Place a blank line between unrelated groups of MXML elements, such as elements defining transitions and an HBox that controls application layout.

Organize MXML documents

Use a consistent structure to organize your MXML; for example:

1. XML Declaration
2. Root XML element with namespaces used in XML document
3. Metadata tags: Event, Style, Effect
4. Style element, should link to an external CSS file
5. Script tag; follow the standards outlined in this article in the Best practices for ActionScript class file organization section.
6. Data related MXML elements, XML, Model, etc.
7. Transitions elements
8. MXML UI controls and containers