listnav.mxml

Flex2StyleExplorer form Adobe

<?xml version="1.0" encoding="utf-8"?>
<mx:Box xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" >
	
	<mx:List id="myListNav" height="100%" width="100%" styleName="fseTree" selectedIndex="{currentView}"
		dataProvider="{views}" change="changeView()" itemRenderer="ListRenderer" />
	
	
	
<mx:Script>
	<![CDATA[
		
		import mx.events.FlexEvent;
		
		[Bindable]
		public var views:Array = [
		 	{label:"Application", flag:false},
		 	{label:"Accordion", flag:false},
		 	{label:"ApplicationControlBar", flag:false},
		 	{label:"Button", flag:false},
		 	{label:"ButtonBar", flag:false},
		 	{label:"CheckBox", flag:false},
		 	{label:"ColorPicker", flag:false},
		 	{label:"ComboBox", flag:false},
		 	{label:"DataGrid", flag:false},
		 	{label:"DateChooser", flag:false},
		 	{label:"HDividedBox", flag:false},
		 	{label:"HRule", flag:false},
		 	{label:"HScrollBar", flag:false},
		 	{label:"HSlider", flag:false},
		 	{label:"LinkBar", flag:false},
		 	{label:"LinkButton", flag:false},
		 	{label:"List", flag:false},
		 	{label:"MenuBar", flag:false},
		 	{label:"NumericStepper", flag:false},
		 	{label:"Panel", flag:false},
		 	{label:"PopUpButton", flag:false},
		 	{label:"ProgressBar", flag:false},
		 	{label:"RadioButton", flag:false},
		 	{label:"TabNavigator", flag:false},
		 	{label:"TextArea", flag:false},
		 	{label:"TextInput", flag:false},
		 	{label:"ToggleButtonBar", flag:false},
		 	{label:"ToolTip", flag:false},
		 	{label:"Tree", flag:false},
		 	{label:"VDividedBox", flag:false},
		 	{label:"VRule", flag:false},
		 	{label:"VScrollBar", flag:false},
		 	{label:"VSlider", flag:false}
		];
	
		[Bindable]
		public var currentView:Number = 0;
		
		private function changeView():void {
        	
		      currentView = myListNav.selectedIndex; 
        	  this.dispatchEvent( new Event("change") );
        }
        
      
		 
		
	]]>
</mx:Script>	

<mx:Metadata>
        [Event("change")]
    </mx:Metadata>

</mx:Box>