projectlistsortingbarbuttonlatest.mxml

flex 实现的一个showcase 喜欢flex的朋友可以

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas
	xmlns:mx="http://www.adobe.com/2006/mxml" 
	xmlns:sortingBar="com.flexShowcase.components.projectList.navigation.sortingBar.*"
	
	width="72"
	height="23"
	
	horizontalScrollPolicy="off"
	verticalScrollPolicy="off"
	
	buttonMode="true"
	mouseChildren="false"
	creationComplete="creationCompleteHandler(event)">
	
	
	<mx:Script>
		<![CDATA[
		
			//////////////////////////////////////////////////
			//import
			
			import com.flexShowcase.constants.ProjectListSortTypes;
			
			
			//////////////////////////////////////////////////
			//getter/setter variables
			
			private var _selected:Boolean = false;
			private var _sortOrder:String = ProjectListSortTypes.DESCENDING_ORDER;
			
			
			//////////////////////////////////////////////////
			//private variables
			
			[Embed(source='/assets/images/frontend/projectlist/projectList_sortingButtons_latest_up.png')] private var upGraphic:Class;
			[Embed(source='/assets/images/frontend/projectlist/projectList_sortingButtons_latest_over.png')] private var overGraphic:Class;
			
			//////////////////////////////////////////////////
			//getter/setter functions
			
			[Bindable]
			public function set selected(value:Boolean):void {
				_selected = value;
				
				selectedHandler();
			}
			public function get selected():Boolean {
				return _selected;
			}
			
			private function selectedHandler():void {
				render();
			}
			
			//------------------------------------------------------
			
			[Bindable]
			public function set sortOrder(value:String):void {
				_sortOrder = value;
				
				sortOrderHandler();
			}
			public function get sortOrder():String{
				return _sortOrder;
			}
			
			private function sortOrderHandler():void {
				arrow.sortOrder = sortOrder;
			}
			
			//////////////////////////////////////////////////
			//initialization
			
			private function creationCompleteHandler(event:Event):void {
				arrow.sortOrder = ProjectListSortTypes.DESCENDING_ORDER;
				
				addEventListener(MouseEvent.MOUSE_OVER,handleMouseOver);
				addEventListener(MouseEvent.MOUSE_OUT,mouseOutHandler);
				
				render();
			}
			
			//////////////////////////////////////////////////
			//private functions
			
			private function render():void {
				if (selected == true) {
					image.source = overGraphic;
				} else {
					image.source = upGraphic;	
				}
			}
			
			
			//////////////////////////////////////////////////
			//handler functions
			
			private function mouseOutHandler(mouseEvent:MouseEvent):void {
				render();
			}
			private function handleMouseOver(mouseEvent:MouseEvent):void {
				image.source = overGraphic;
			}
			
			
		]]>
	</mx:Script>


	<mx:Image id="image" />
	<mx:Label id="title" styleName="myriadRegular" y="2" width="72" text="Latest" textAlign="center" color="0x666666" mouseEnabled="false" buttonMode="true" />
	
	<sortingBar:ProjectListSortingBarButtonArrow id="arrow" x="9" y="9" />
	
	
</mx:Canvas>