Flex best practices

31 10 2008

While working on Let’s Go Green application, I learnt some important techniques in Flex that I’d like to share:

1. For rendering a corner radius to a container (for example: Canvas, HBox, etc.), first set the borderStyle to “solid”.

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="300" height="200"
backgroundColor="#FFFFFF" borderStyle="solid" cornerRadius="8">
</mx:Canvas>

2. For making your layout center and middle aligned in a browser, put all the UI tags inside one container (for example: Canvas, VBox, etc.) and set its horizontalCenter to “-22” and verticalCenter to “-22”.

<mx:VBox id="mainContainer" width="300" height="200" horizontalCenter="-22" verticalCenter="-22">
</mx:VBox>

3. Use weak references for event listeners to make them available for garbage collection. This will reduce memory leaks. Just use the default values for the 3rd and 4th parameters – useCapture and priority – but use true for weakReferences.

addEventListener(ResultEvent.RESULT, onResults_add, false, 0, true);

4. Arrays do not support data binding. In case data needs to be stored in an Array structure and then it needs to be binded with some UI component, use ArrayCollection object which supports data binding.

  
5. While your application is busy fetching some back-end data, you can set the cursor to let users know that the application is currently busy.

For setting the cursor to busy, use CursorManager.setBusyCursor() 

For resuming the defaultcursor, use CursorManager.removeBusyCursor()





Flex AMF3

30 10 2008

Here’s a very interesting app made by James Ward for comparing the performances of different web technologies for building RIAs – Flex & AMF3, AJAX & XML, AJAX & JSON, and so on. You select a technology pair and click Execute. The command will fetch 5000 rows from a database and show the proformance results in terms of server execution time, transfer time, and so on.

http://www.jamesward.com/wordpress/2007/04/30/ajax-and-flex-data-loading-benchmarks/

Of all the technology pairs listed in this app, I’ve used Flex XML AS, Flex XML E4X, and Flex AMF3. Out of these I’ve found Flex AMF3 very easy to use, fast, and responsive. To get started with this technology I’d recommend chapter 7 of the following book by Friends Of Ed…

http://www.friendsofed.com/book.html?isbn=1430209933





My first flex app

29 10 2008

Since the beginning of my career I’ve experienced that the best way to learn a new technology is to first go thru some of the tutorials and documentation. Then apply the little knowledge you have gathered and build something – maximum learning happens on the job.

So, I’ve built this little web app using Flex, PHP, and MySQL. It’s is a community building app for environmentally conscious people.  I’ve also implemented the Cairngorm framework here. Using a MVC framework in your Flex app has a lot of advantage. It separates the 3 layers – model, GUI, and business logic and helps streamline the development process. Saves a lot of time in the long run and reduces margin of error.

Check out Let’s Go Green

Let's Go Green

Let's Go Green

P.S. This is in beta stage.





Flash SEO

26 10 2008
Flash seo is the one big disadvantage that flash has over AJAX. However, recent developments with adobe partnering with google and yahoo in this direction is good news for the flash/flex community.

Dominic Gelinieau has done some extensive research regarding flash seo, how google indexes flash content. These are very interesting findings… 

Hope google and yahoo add more power to flash/flex content search in the future.




Flex – getting started!!

24 10 2008

For some time now, I’ve really got hooked to Adobe Flex wich is a RIA authoring technology framework based on Flash player from Adobe. Being a Flash developer for past 6 years, this product came as a big shot in the arm for Flash developers like me. After going through some documentation and playing around with some of the components, I realised this is a big productivity booster over building an app in Flash.

To come up the learning curve, I’d recommend going through the Flex documentation and/or this ebook…