Google analytics code

Wednesday, August 12, 2009

Flex: Working with LinkBar viewstates

I've started experimenting with the LinkBar component for some navigation elements. I didn't want to use ViewStates because I'm loading and unloading items in a main window. I wanted to use it to capture navigation changes.

You can capture clicks on each part of a LinkBar and then do what you want from there. This is the code I used.


<![CDATA[
import mx.events.ItemClickEvent;
import mx.collections.ArrayCollection;

private var links:Array = [{label:'Browse', id:'browseLink'},{label:'Search', id:'searchLink'}];

[Bindable]
public var linkBarDataProvider:ArrayCollection = new ArrayCollection(links);

private function init() : void {
linkBar.addEventListener(ItemClickEvent.ITEM_CLICK, handleLinkBar);
}

private function handleLinkBar(event:ItemClickEvent) : void {
trace('item clicked: ' + event.item.id);
}
]]>




I created an Array with each navigation item I wanted and gave it a identifier. An event listener was set on the LinkBar to watch when items inside are clicked. The triggered event is ItemClickEvent.ITEM_CLICK. The event is passed to a function that will then look at the property called item. item is a reference to the element from the Array it used to create the navigation element. After I know which link was clicked I can load or unload the next item in the display.

The example was based on the post I found here.

No comments:

Post a Comment

If you found this page useful, or you have any feedback, please leave a comment.