Flex个人知识库(3)

1、 DataGrid中的行数据交换位置

<?xml version="1.0" encoding="utf-8"?>   
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:window="com.diaztorres.window.*" xmlns:log="com.log.*">   
<mx:Script>   
    <![CDATA[   
       import mx.collections.IList;     
       import mx.collections.ArrayCollection   
       import mx.controls.Alert;         
       public function moveUp(event : MouseEvent) : void  
        {                    
           var i : int = peopleList.selectedIndex;
            
          if (i >= 1&&peopleList.selectedItem)   
           {                
          
             IList(peopleList.dataProvider).addItemAt(peopleList.selectedItem,i-1);
              //Alert.show(peopleList.selectedIndex.toString());                     
             IList(peopleList.dataProvider).removeItemAt(i+1);   
             peopleList.selectedIndex = i;   
                         //Alert.show(i.toString());
            }   
        }   
           
       public function moveDown(event : MouseEvent) : void  
        {   
        var i : int = peopleList.selectedIndex;         
       if (i < (ArrayCollection(peopleList.dataProvider).length - 1) && peopleList.selectedItem)   
        {                
           IList(peopleList.dataProvider).addItemAt(peopleList.selectedItem,i + 2);                     
                IList(peopleList.dataProvider).removeItemAt(i);      
                peopleList.selectedIndex = i;                }               
        }                       
         ]]>   
     </mx:Script> 
      <mx:Array id="arrDP">
        <mx:Object c="1" c1="One" />
        <mx:Object c="2" c1="One" />
        <mx:Object c="3" c1="One" />
</mx:Array>  
     <mx:VBox horizontalAlign="center" x="618" y="176" height="264">      
     <mx:DataGrid id="peopleList"  dataProvider="{arrDP}"  x="198" y="66" width="302">   
          
     </mx:DataGrid>   
     <mx:ControlBar width="298" horizontalAlign="right" height="26">   
         <mx:Button label="上移" click="moveUp(event)"/>   
         <mx:Button label="下移" click="moveDown(event)"/>   
     </mx:ControlBar>       
</mx:VBox>   
</mx:Application>

2、 ArrayCollection排序

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"
			   >
	<s:layout>
		<s:BasicLayout/>
	</s:layout>

	<fx:Script>
		<![CDATA[
			import flashx.textLayout.factory.TruncationOptions;
			
			import mx.collections.ArrayCollection;
			import mx.collections.Sort;
			import mx.collections.SortField;
			
			[Bindable]
			private var ac:ArrayCollection = new ArrayCollection([{ID:0,userName:"AAA"},
				{ID:1,userName:"CCC"},
				{ID:2,userName:"BBB"}]);
			
			public function init():void{
//				ac.addItem(
//					[{ID:0,userName:"AAA"},
//					{ID:1,userName:"CCC"},
//					{ID:2,userName:"BBB"}]
////				);
//				ac = (
//					[{ID:0,userName:"AAA"},
//						{ID:1,userName:"CCC"},
//						{ID:2,userName:"BBB"}]
//				);
			}
			protected function button1_clickHandler(event:MouseEvent):void
			{
				var sort:Sort = new Sort();//定义sort对象
				//选择排序的字段(默认是按升序排序的)
				sort.fields = [new SortField("userName")];
				//把Sort对象赋给ac
				ac.sort = sort;
				
				//如果按照降序排序，需要修改一下
				//sort.fields = [new SortField("userName",true,true)];
				
				//如果先降序（ID）后升序（userName），就这样写，以此类推
				//sort.fields = [new SortField("userID",true,true),new SortField("userName")];
				
				ac.refresh();
			}
			protected function button2_clickHandler(event:MouseEvent):void
			{
				var sort:Sort = new Sort();//定义sort对象
				//选择排序的字段(默认是按升序排序的)
				sort.fields = [new SortField("userName",true,true)];
				//把Sort对象赋给ac
				ac.sort = sort;
				ac.refresh();
			}
		]]>
	</fx:Script>


	<fx:Declarations>
		<!-- 将非可视元素（例如服务、值对象）放在此处 -->
	</fx:Declarations>
	
	<s:Button label="升序排序" click="button1_clickHandler(event)" fontSize="20" x="10" y="61"/>
	<s:Button label="降序排序" click="button2_clickHandler(event)" fontSize="20" x="10" y="190"/>
	<s:List x="288" y="99" dataProvider="{ac}" labelField="userName" >
	</s:List>
	
</s:Application>

3、 将图片作为背景（非嵌入式)
NoBedImage

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:local="*"
			   width="90%" height="90%" viewSourceURL="srcview/index.html">
	
	<s:Group width="100" height="100" horizontalCenter="0" y="10"><!--{widthSlider.value}-->
		<local:TiledImage source="assets/appPlatform.png" width="100%" height="100%" />
		<s:Label text="Tiled Background" fontSize="16" horizontalCenter="0" verticalCenter="0" fontWeight="bold" />
	</s:Group>
	
	<!--<s:HSlider id="widthSlider" value="200" minimum="150" maximum="300" horizontalCenter="0" y="125" />-->	
</s:Application>

<?xml version="1.0" encoding="utf-8"?>
<s:Group xmlns:fx="http://ns.adobe.com/mxml/2009" 
		 xmlns:s="library://ns.adobe.com/flex/spark" 
		 xmlns:mx="library://ns.adobe.com/flex/mx">
	
	<fx:Script>
		<![CDATA[
			import mx.controls.SWFLoader;
			import flash.display.BitmapData;
			import flash.display.Bitmap;
			
			public function set source(value:Object):void {
				loader.source = value;
			}
			
			private function updateSource():void {
				// use a SWFLoader to download the bitmap data then push that into the BitmapImage
				bitmapImage.source = loader.content;
			}
		]]>
	</fx:Script>
	<mx:SWFLoader id="loader" complete="updateSource()" width="0" height="0" />
	<s:BitmapImage id="bitmapImage" width="100%" height="100%" fillMode="repeat" />
	
</s:Group>

4、 Datagrid根据条件改变行背景色
DataGridDrawRowBackground

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" fontSize="12" xmlns:local="*" width="400" height="300">
	<mx:Script>
		<![CDATA[
			[Bindable]
			private var _record:XML =
				<list>
				<user name="小明" result="60"> </user>
				<user name="小红" result="59"> </user>
				<user name="小白" result="75"> </user>
				<user name="小黑" result="38"> </user>
				<user name="小青" result="80"> </user>
				<user name="小文" result="100"> </user>
				<user name="小鬼" result="99"> </user>
				<user name="小东" result="40"> </user>
				</list>
				
		]]>
	</mx:Script>
	<local:MyDataGrid dataProvider="{_record.user}" right="5" left="5" top="5" bottom="5">
		<local:columns>
			<mx:DataGridColumn headerText="姓名" dataField="@name"/>
			<mx:DataGridColumn headerText="成绩" dataField="@result"/>
		</local:columns>
	</local:MyDataGrid>
</mx:Application> 

MyDataGrid

<?xml version="1.0" encoding="utf-8"?>
<mx:DataGrid xmlns:mx="http://www.adobe.com/2006/mxml">
	<mx:Script>
		<![CDATA[
			override protected function drawRowBackground(s:Sprite, rowIndex:int, y:Number, height:Number, color:uint, dataIndex:int):void
			{
				var list:XMLList = new XMLList(dataProvider)
				if(dataIndex < list.length() && list[dataIndex].@result <60)color = 0xFF6600
				super.drawRowBackground(s,rowIndex,y,height,color,dataIndex);
			}
		]]>
	</mx:Script>
</mx:DataGrid>

^_^  ^_^ 

import flash.display.Sprite;
	
	import flashx.textLayout.events.ModelChange;
	
	import mx.collections.ArrayCollection;
	import mx.controls.DataGrid;
	
	public class DatacenterDataGridRowColor extends DataGrid
	{
		public function DatacenterDataGridRowColor(){//this.setStyle("backgroundColor", 0xFF0000);
			//this.setStyle("backgroundAlpha", 0.27);
		}
		override protected function drawRowBackground(s:Sprite, rowIndex:int, y:Number, height:Number, color:uint, dataIndex:int):void
		{
			if(dataProvider!=null && dataIndex<dataProvider.length){
				var item:Object = dataProvider.getItemAt(rowIndex);
				if( item.status == "禁用") color = 0xffeabc;
			}
			super.drawRowBackground(s, rowIndex, y, height, color, rowIndex);
		}
	}

附个人Cairngorm工程