Flex Quick Starts: Building an Advanced User Interface

There is a 6-part overview for building an advanced user interface with Flex in the Flex Quick Starts area of the Adobe Flex Development Center.

1. Using the Repeater component: You can use the Repeater component to emulate loops by executing multiple times instructions for creating components or containers that associate to the number of items in an array. One important thing to remember is that the Repeater component instantiates all objects that are repeated, whereas the HorizontalList, TileList and List controls only instantiate objects visible in the list, so there are performance considerations here.
2. Skinning your components: You can skin components in various status either graphically or programmatically using either inline code, using the setStyle() method or using CSS.
3. Using item renderers: There are several controls derived from the ListBase class that you can use to represent lists of items: DataGrid, HorizontalList, List, Menu, TileList and Tree. Drop-in item renderers allow you to customize the display of items using components that implement the IDropInListItemRenderer interface. You can exert more control over the rendering by defining in-line item renderers, either in a separate area of the application code using the Component tag or in their own MXML files as custom components.
4. Creating item editors: You can use item editors to let users modify the value of a cell in list controls such as the DataGrid, List and Tree. You use drop-in item editors just like you do drop-in item renderers.
5. Using data providers: You can use the ArrayCollection mechanism to robustly bind object data to list-based controls. If a control needs to handle different types of collections (i.e. ArrayCollection and XMLListCollection, then you should bind the data provider to a type ICollectionView. There was an example illustrating the use of an HTTPService that stores XML data into an ArrayCollection. Another example illustrated modifying data in data providers and listening for events.
6. Adding drag-and-drop support: There are several components with drag-and-drop capability in Flex: DataGrid, HorizontalList, List, Menu, PrintDataGrid, TileList and Tree. You can also create custom drag-and-drop behaviors with components.