Code Formatting for Flex Builder 3
Recently I’ve been introduced to a code formatter for Flex Builder 3 and thought it was worth sharing. The plug-in formats, indents and rearranges both MXML and ActionScript code.
Downloading the plug-in
There is a version of the plug-in available here, but I haven’t installed it from there. Below I’ve included instructions on how to install the plug-in using the software updates feature in Flex Builder.
Installing the plug-in via Software Updates
- Launch Flex Builder 3 and go to Help>Software Updates>Find and install…
- Check the Search for new features to install option and click Next
- Now create a New Remote Site…
- Enter the following URL for the remote site and give it a name, such as Flex Code Formatter and click Finish:
http://flexformatter.googlecode.com/svn/trunk/FlexFormatter/FlexPrettyPrintCommandUpdateSite - Browse the tree to find the code formatter plugin ( FlexPrettyPrintCommandFeature Feature 0.6.27 ) and click Next.
- Accept the license agreement and click Next then Finish.
- Click Install All and restart Flex Builder 3. The plug-in is now installed and ready to use.
Using the plug-in
Once Flex Builder has restarted you should notice a new toolbar with some black and white icons. This toolbar gives you access to the following features:
- Generating ASDoc comments for the file
- Generating ASDoc comment for the current element
- Format code
- Indent code
- Rearrage the code of the file
There will also be a shortcut key set up for formatting code; the default is CTRL+SHIFT+F.
Editing the Preferences
To edit the preferences of the plugin go to Window>Preferences. Then browse to Flex Formatting using the tree navigation on the left. There are a vast array of formatting and restructuring options available, so you should be able to find something to suit the way you code. It is also worth browsing the navigation tree to show the options for Auto Format; this will give you the option to format or indent code when you save.
Subscribe to the RSS
Follow me on Twitter
Follow me on GitHub
Thanks! This is just what I was looking for.
October 16th, 2009I love you! I found it so stupid that adobe took eclipse (which HAS code auto formatting) and somehow didn’t tweak it for actionscript code (whose syntax is very similar to java!)
Looking at messy code is very very annoying, and I am visibly estatic that I finally found a way to auto format actionscript code! kudos =)
November 11th, 2009@mark I’m glad you found it useful! I hate looking at messy code too, it was horrible picking up someone else’s work until I started using this! Thanks for the comment Mark.
Mark ( @mark_star )
November 12th, 2009Thank you. It is very helpful.
March 5th, 2010Google is my friend and helped me find this link to Flex’ most notable Missing Feature! Thanks for the tip
March 21st, 2010Ausome buddy! Thanks a lot! I will be gr8ful if u find the same plug in for flashDevlop software.
April 9th, 2010Thank you very much. This is an awesome feature and extremely helpful. The plug in has further editable parameters to suit ones need. Thanks a lot.
April 13th, 2010This has made my life so much easier!!! Thanks
April 23rd, 2010This is really cool. I am from Flash background and was looking for this type of time saving thing. Thanks.
August 23rd, 2010Nice Post..!
September 11th, 2010Great post.
Incidentally, Flex 4 (Flash Buider 4) now HAS formatting and indenting as standard
January 13th, 2011You’re right KM. It does, however it doesn’t have the plethora of formatting options that come with the code formatter. I’d strongly recommend using the code formatter still, especially if you’re working in a team.
Mark
January 13th, 2011[...] ?????: http://markstar.co.uk/blog/2009/flashplatform/flex/code-formatting-for-flex-builder-3/ ?????????? ? ???. ????? ? ??? [...]
June 11th, 2011