Thursday, August 30, 2007

The Road to Flex-1

AJAX is good and I am already finding very good books and tutorials for the same on the web and the internet. But with Flex things are different, especially in India. Good books are still not available and I am not very happy with the internet resources.

So, here I am starting a compilation of what I have learned in flex 2.0 as it comes to me basis. I am not trying to make a tutorial YET. But what I am trying is compiling the basics for anybody who may find it useful. If it helps even one guy, this is going to be worth it:). Any comments welcome!

Everyday or so I will mention few things I learned about Flex 2.0 , possible interview questions one could frame using them and a sample MXML demonstrating the point. In "Road To Flex" series I will clobber whatever I learnt and feel I cannot put under one general topic. Specific topics/problems would invite separate entries from time to time.

My resources are the internet and Training from the Source book by Adobe.

For today:
  • You can have only one <mx:Application> tag per Flex application
  • UI Layout in an application can be absolute, vertical or horizontal.
  • All layout in flex is done using containers:VBox, HBox, Canvas, Application, Tile, Panel, ControlBar, ApplicationControlBar
  • ControlBar is used to dock a toolbar to the bottom of a panel container or a titlewindow container
  • ApplicationControlBar used to hold components that provide access to elements used throughout an application. If specified as first child of <mx:Application> tag and dock attribute set to true, docks at top of app's draw area, extends full width and does not scroll.
Interview questions that can be asked for these points:
  1. How many <mx:Application> tags can a flex application have?
  2. What are possible values for UI Layout?
  3. Name some containers used by Flex.
  4. Which container will you use to make a toolbar?
  5. What is the use of an ApplicationControlBar?

A sample MXML demonstrating some of the points:

<?xml version="1.0" encoding="utf-8"?>
<mx:application mx="http://www.adobe.com/2006/mxml" layout="horizontal">
<mx:applicationcontrolbar dock="true">
<mx:linkbutton label="Link1"/>
<mx:linkbutton label="Link2"/>
</mx:ApplicationControlBar>
<mx:panel id="panel1" title="My Panel">
<mx:Controlbar></mx:ControlBar>
</mx:Panel>
<mx:VBox id="vertBox">
<mx:panel id="panel2" title="Panel Inside">
<mx:controlbar></mx:ControlBar>
</mx:Panel>
</mx:VBox>
</mx:Application>