Saturday, May 7, 2011

How to add custom Quick Assist options to FlashBuilder 4.5 ?

Adding custom quick assist options to FlashBuilder 4.5.1 is easy.

Here is a sample plugin I created to show how this can be done. Copy this plugin into the dropins folder found under the "Adobe FlashBuilder 4.5" folder of the installation. In FB pressing Ctrl+1 inside a ActionScript class or script block of MXML file should bring up the "Override/Implment Methods" quick assist option as shown below.

One needs to implement the "com.adobe.flexbuilder.as.editor.quickAssistProvider" extension point to add custom quick assist providers in a custom plugin. The extension point requires the IQuickAssistProvider interface to be implemented by a class and supply this as a "class" value to the extension point description.

Step by step instructions on how to do this:

1. Create a new workspace and import the following plugins from FlashBuilder plugins folder. (These are the basic plugins which are required for the example. You may need to import more plugins based on the exact quick assist you want to implement.)

com.adobe.flash.codemodel.core

com.adobe.flexbuilder.as.editor

com.adobe.flexbuilder.codemodel

com.adobe.flexbuilder.editorcore

com.adobe.flexbuilder.editors.derived

com.adobe.flexide.as.core

com.adobe.flexide.editorcore

2. Create a new plugin called say "com.adobe.flashbuilder.extras"

3. Add the extension point "com.adobe.flexbuilder.as.editor.quickAssistProvider"

4. Create a class implementing the interface IQuickAssistProvider by clicking the class link. Add the necessary code for the required functionality in the class following the example source given.

The interface has only one method getProposals which needs to return a list of proposals that need to be displayed at the particular offset at which the user has invoked the quick assist. Using the information available in the IQuickAssistInvocationContext and other code model APIs the code can arrive at this list.

5. Export the new plugin and place the jar in the dropins folder under the FB installation.

Caution : In case you find that quick assist functionality of FB stops working check the logs to see if the new plugin is causing any exceptions causing this.

The example source is available here.

Saturday, April 30, 2011

"What is new in FlashBuilder 4.5" session at 360Flex video

Video of Adam's session on "What is new in FB 4.5" at 360Flex is available here

Sunday, April 24, 2011

FlashBuilder Tips and Tricks slides

A copy of the slides I showed in 360Flex is available here.

In the end there are few more slides which I didn't show as they are already available in MAX 2010 and MAX 2009 videos.

There is also an article which contains most of the information presented but not all !

Wednesday, April 13, 2011

Use QuickAssist in FlashBuilder 4.5 to create labelFunction,iconFunction,dataFunction etc..

One of the cool features of FlashBuilder 4.5 is support for creating labelFunction, sortFunction, dataFunction, iconFunction (basically any Function property of Flex SDK MXML components) using Quick Assist.

Steps :

1. Go to the component tag and use content assist to enter the *Function attribute.

Ex: <s:List labelFunction=""

2. Type the function name.

Ex: <s:List labelFunction="myLabelFunc"

3. With the cursor still between the quotes hit Ctrl+1 (or Cmd+1 on Mac).

4. You should something similar to the following

5. Select it and hit enter. FB should create the function with proper signature and go into linked mode.

For adventurous developers:

If you find the "Create function ..." option missing any particular Function property for any component you can edit the componentDescriptor.xml file (which can be found under the Adobe Flash Builder 4.5\eclipse\plugins\com.adobe.flexbuilder.mxml.editor_4.5.0.xxxxx directory) and add the entry yourself and fix it !

Caution : Save the original xml file in case you end up spoiling it.

How to use code templates to enter keywords without mistakes ?

After my "FlashBuilder tips and tricks" session at 360Flex where I erred while entering "implements" keyword I thought through it and came up with this. Add the following code template with any name it suits you. I used "kw".

${keyword:values(public, protected, private, function, implements, var, try, catch, class, interface, package)} ${cursor}

Now where ever I need to enter a keyword I just need to type "kw" and hit Ctrl+Space to get a popup showing all the keywords. (Note: Modify the list of keywords to suit your need)