projectlisthybridviewitem.mxml

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

<?xml version="1.0" encoding="utf-8"?>
<components:SelectAwareItemRenderer
	xmlns:mx="http://www.adobe.com/2006/mxml"
	xmlns:components="com.flexShowcase.components.*"
	
	width="760"
	height="90"
	
	horizontalScrollPolicy="off"
	verticalScrollPolicy="off"
	
	select="handleSelect()"
	
	creationComplete="creationCompleteHandler(event)">
	
	
	<mx:Script>
		<![CDATA[
		
			//////////////////////////////////////////////////
			//import
			
			//////////////////////////////////////////////////
			//initialization
			
			private function creationCompleteHandler(event:Event):void {
				addEventListener(MouseEvent.MOUSE_OVER,handleRollOver);
				addEventListener(MouseEvent.MOUSE_OUT,handleRollOut);
				
			}
			
			
			//////////////////////////////////////////////////
			//private functions
			
			private function showRollOver():void {
				container.styleName = "projectListItemOver";
				title.styleName = "myriadRegularWhite";
				description.styleName = "projectListItemDescTextOver";
				
				detailsStrip.renderAsOver();
			}
			
			private function hideSelected():void {
				container.styleName = "projectListItemOut";
				title.styleName = "myriadRegular";
				description.styleName = "projectListItemDescTextUp";
				
				detailsStrip.renderAsUp();
			}
			
			private function showSelected():void {
				container.styleName = "projectListItemSelected";
				title.styleName = "myriadRegularWhite";
				description.styleName = "projectListItemDescTextOver";
				detailsStrip.renderAsOver();
			}
			
			
			
			//////////////////////////////////////////////////
			//handler functions
			
			private function handleSelect():void{
				if (isSelected) {
					showSelected();
				} else {
					hideSelected();
				}
			}
			
			public function handleRollOver(mouseEvent:MouseEvent):void {
				if(!isSelected){
					showRollOver()
				}
			}
			public function handleRollOut(mouseEvent:MouseEvent):void {
				if(isSelected){
					showSelected();
				}else{
					hideSelected();
				}
			}
			
			
		]]>
	</mx:Script>
	
	
	<mx:Canvas id="container" height="85" width="100%" buttonMode="true" mouseChildren="false" horizontalScrollPolicy="off" verticalScrollPolicy="off">
		<components:ThumbnailRenderer id="imageCanvas" project="{data as Project}" left="5" top="5" width="123" height="74" />
		
		<mx:Label id="title" styleName="myriadRegular" x="{imageCanvas.x + imageCanvas.width + 10}" text="{data.name}" />
		<components:ProjectDetailStrip id="detailsStrip" data="{data}" horizontalAlign="right" />
		
		<mx:Text id="description" styleName="projectListItemDescTextUp" left="143" top="20" width="577" height="60" htmlText="{data.description}" fontWeight="normal" selectable="false" />
	</mx:Canvas>
	
	<mx:Image source="@Embed('/assets/images/frontend/projectlist/projectList_listItemDiv.png')" left="5" bottom="0" />
	
	
</components:SelectAwareItemRenderer>