Flex Builder Shortcuts

I’ve found that many developers don’t know some of the coolest time saving features available to them. This can be anything like patterns, frameworks, plugins, even databases. This post is focused on the one thing that most Flex developers use everyday, the IDE.   I know some of you out there are using Notepad (or more likely TextMate or VI), but this post is for the rest of us that choose to suffer through the slings and arrows of Flex Builder.

One of the great things about Flex Builder being built on the Eclipse Platform is getting most (unfortunately not all) the features Java (and other) developers have been used to for years.  This post focuses on the shortcuts I like to use nearly everyday.

Navigation

  • To kick off the list is [ctrl]+[click]. This has to be the single fastest way to navigate through the code when following an execution path. Note, this is the same as [F3], or [rt click]->”Goto Definition“.
  • [ctrl]+[o]. Along the same lines as the above shortcut for quick navigation, [ctrl]+[o] brings up the quick outline. Note that the box on top is a filter box (a common theme in the IDE) that filters the contents (note it does not support wild cards)
  • [ctrl]+[f6] (same as [ctrl]+[tab]), [ctrl]+[f7], & [ctrl]+[f8]. These all basically do the same thing, just for different aspects. They bring up a list of Editors, Views, or Perspectives in last visited order. This means you can toggle between the last two items very quickly. I also find this much faster for finding a specific file than scanning the tabs across the top.
    ViewsPerspectives
  • [ctrl]+[e] – Similar to [ctrl]+[f6], the big advantage this feature has is the search box (including pattern matching). If I’m switching between more than just two files this is my preferred method.
  • [ctrl]+[pg up] & [ctrl]+[pg down] Since we are talking about moving through views, these are the easiest way to sequentially move through editors. Since I have a tendency to have a dozen or more open at a time I use this less than two methods above.
  • [ctrl]+[shift]+[t] & [ctrl]+[shift]+[r]. Open Type and Open Resource, both dialogs are great time savers for opening a target file or class. If you are like me and hate to use the mouse any more than absolutely necessary these two dialogs eliminate any need to use the navigator to find a file. Both dialogs are effectively the same, but Open Type only lists types which makes it faster for Type searches.
  • [ctrl]+[shift]+[g] – Search for References in the current workspace. This is great when assessing code change impacts. Just place the cursor on the symbol you want to hunt for and hit [ctrl]+[shift]+[g] the search view will spit out every reference in your current workspace. There is also [ctrl]+[g] for searching for Definitions, I just don’t use it very often.
  • [alt]+[left] [alt]+[right] – Moves through the last areas you edited. Basically a super weak version of Bookmarks.
  • [ctrl]+[m] Maximize Window toggle, same a double clicking the tab for the editor. I use this constantly to see more code and then jump back to debug view.
  • [ctrl]+[shift]+[p] – Goto matching bracket, really useful on larger blocks of code.
  • [ctrl]+[L] - Goto Line #. Especially useful when debugging an error spit out at runtime with a stack trace.
  • [ctrl]+[,] & [ctrl]+[.] – Next and Previous problem.
  • [ctrl]+[f] Opens the find dialog, [ctrl]+[k] repeats the last search (same as [f3] in most windows based IDE’s)
  • [ctrl]+[3] Quick Access Uber tool. This little gem basically lets you execute anything. You can switch editors, views, perspectives, execute commands, it even has a list of your previous choices to provide quick access to any commands that don’t have their own shortcuts. Note again that this includes a filter, although it does not support wildcards :(

Code Editing

  • [ctrl]+[space]. Seriously, I’ve been asked more than once “what is that key that brings up the list of available methods?” This is one of those features that makes life so much easier. Even more than standard code completion, this great feature will automatically add the selected class to your imports if needed! This is great when copying code between classes, I just delete the last character and trigger code completion, done!
  • [ctrl]+[shift]+[space], similar to code completion Parameter Assist is critical when working with libraries (like the Flex Framework). It provides a summary of the parameters of the current method invocation.
  • [ctrl]+[/] Super quick way to comment/uncomment lines of code
  • [ctrl]+[d] Delete the current line
  • [alt]+[up] & [alt]+[down] Move current line up (or down). Great for quickly moving code around. Also works with groups of code by highlighting multiple lines.
  • [ctrl]+[alt]+[up] - Duplicate current (or selected) lines.
  • [ctrl]+[shift]+[o] - Organize Imports, basically just removes any unnecessary imports.

One last shortcut that must be listed

[ctrl]+[shift]+[L] lists all shortcuts, hit [ctrl]+[shift]+[L] with the list open to open the editor.

With all that said, I sorely miss two things from my CodeGear/MSVS IDE’s. First is autoformatting. I know a lot of people hate to have the format forced on you, however I find it a great time saver and keeps things nice and tidy. And yes I know that Eclipse has autoformatting features, but not for MXML/AS (at least not that I can find, PLEASE let me know if I’m wrong).

Second is bookmarks. I’m used to setting a bookmark with [ctrl]+[shift]+[1], then I can be anywhere else in the project and hit [ctrl]+[1] to jump to the bookmark.

Actually, make that three things – Refactoring Tools. This is another one where Java tools in Eclipse have the features, but AS doesn’t.

Ok so this post started as a quick hit list of my most used shortcuts, but I made the mistake of leaving the draft up while I was working on a project. Each time I used a shortcut I dropped it on the post, now it has gone from a quick list to a pretty long list… One of these days I’ll learn how to be more timely with my posts to keep them from being to long winded…

So what are your favorite shortcuts?

Update May 6th, 2009

Ernest Pasour has answered one of my wish list items and created an open source Flex Formatter (works with AS & MXML).  You can grab it off SourceForge here.  My recommendation is to add a new Remote Site in Eclipse with:

Name: Flex Formatter
URL: http://flexformatter.googlecode.com/svn/trunk/FlexFormatter/FlexPrettyPrintCommandUpdateSite

This allows you to keep up to date with changes easily. (And Ernest is obviously quite busy adding features).

11 Responses to “Flex Builder Shortcuts”

  1. ryan Says:

    best shortcuts ever dude….

  2. Ian Says:

    Very Cool -

  3. todd Says:

    Nice listing of useful shortcuts. I found this because I was looking for Bookmarks shortcuts, too. I miss that about MSVS.

  4. mbir Says:

    I’ve actually been thinking about creating a plugin for Eclipse for bookmarks. The feature is simple enough, most tedious aspect is learning the Eclipse plugin framework and we have to do that for another project we are working on anyways… First I’m gonna see if http://www.idefactory.com/ will throw it into their Flex plugin ;)

  5. rconceiver Says:

    Ctrl+Alt+Down doesnt work in flex to copy line what may be the reason?

  6. Chris Says:

    Awesome, thanks much.

  7. Ernest Says:

    I’ve thrown together an AS/mxml formatter that many people have found useful. YMMV of course.

    http://sourceforge.net/project/platformdownload.php?group_id=248408

  8. mbir Says:

    Ernest,

    I really need to update my Blog more. Grabbed your formatter couple months ago, was fairly unhappy with the stability (especially as I have a lot of XML code that it had a problem parsing). Grabbed the update a couple weeks ago and now it ROCKS. No show stoppers for me at all. We now share format configs around the team so everyone is on the same settings. Great work!

  9. Ernest Says:

    Excellent, I’m glad things are better for you now.

    A couple of questions for you:
    1. Did you have problems with mxml or embedded xml? I’m just curious what I fixed.

    2. If you do much mxml coding, have you tried (or do you care about) attribute ordering? There are some relatively recent changes (probably since 0.6.16) for grouping attributes together (like all namespace attrs). The ability to control attr ordering was there from the start, but it’s a little more useful now.

    3. How are you sharing the settings with your team? Are you using Import/Export or did you try the new “auto sync from file” option? Eclipse doesn’t really provide a great way to share workspace-level settings, but this option would kind of work with CVS to keep options synchronized among team members when the options are tweaked.

  10. mbir Says:

    1. Embedded XML. I have a tendency to use embedded XML in my test harnesses as a quick and dirty way to simulate data. Prior to the current release I am on (don’t know the version number of the last one I used) it would just throw an exception.

    2. I’ve messed around with the attribute ordering, but haven’t applied any real policies to it. Will dig into it soon to see if I can make it do anything useful for me. I think ideally it would allow layouts similar to the Flex Properties panel:
    Common
    Style
    Layout
    Effects
    Events
    Other

    Luckily our MXML has not been the bulk of our work so have not really been annoyed by this too much. But would be nice…

    3. Import/Export right now, and yes Eclipse workspace settings management sucks. I’ll have to try the autosync from file setting as everything we do is in SVN.

    Keep up the excellent work!

    One thing to consider… Style Browser, so you can have some contributors upload their styles – then users can pick their favorite and download to their local settings…

  11. Ernest Says:

    Okay, thanks for the info.

    1. Hmm. Okay, well glad it’s working now :)

    2. The formatter does predefine some groups (effects, styles, properties, and events, I think). The groups are hardcoded (but modifiable) and I got them from crawling through the ASDoc for some Adobe classes. You can create your own groups or extend the ones I created. You can also use wildcards (java-style regex).

    3. There is some explanation of how to use it in the ? settings on the pref dialog.

    4. I did push a new plug-in that you may have some feedback on. It’s a simple plugin that emits asdoc comments for the current element or file. It’s a first cut, but if that capability is something you would find useful, then you are welcome to pull it down and ask questions/file bugs. It’s 2 jars in the “Test Code” package at the flexformatter site. I didn’t really have an set of requirements for it, so I’m still waiting to see if people consider it useful before I bundle it with the flex formatter code.

Leave a Reply