`

个人Flex知识库(1)

阅读更多
1、 给Flex事件传递多个参数
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	
	<mx:Script>
		<![CDATA[
			import asfile.EventArgExtend;
			import mx.controls.Alert;
			
			//调用addEventListener()方法时传递多个参数
			 private function clickHandler(e:Event,...arg):void
            {
                Alert.show(arg[0].toString());
                Alert.show(arg[1].toString());
            }
            
            private function passMultipleArguments():void{
            txtShow.addEventListener(MouseEvent.CLICK,EventArgExtend.create(clickHandler,1,"str"));
            }
		]]>
	</mx:Script>
	<mx:Button label="传递多个参数" click="passMultipleArguments()" id="txtShow" x="394" y="173" height="52" width="155"/>
</mx:Application>


2、 Array与ArrayCollection的区别
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
      <mx:Script>
          <![CDATA[
              import mx.collections.ArrayCollection;
              [Bindable]
              public var myArray:Array=["北京","上海","深圳"];
              [Bindable]
              public var myCollection:ArrayCollection=new ArrayCollection(myArray);
              public function addCountryToArray(country:String):void{
                  myArray.push(country);
              }
              public function addCountryToCollection(country:String):void{
                  myCollection.addItem(country);
              }
          ]]>
      </mx:Script>
      <mx:TextInput id="countryTextInput" text="广州"/>
      <mx:Label text="Bound to Array (Raw Object)"/>
      <mx:Button click="addCountryToArray(countryTextInput.text)" label="Add Country to Array"/>
      <mx:List dataProvider="{myArray}" width="200"/>
      <mx:Label text="Bound to Collection"/>
      <mx:Button click="addCountryToCollection(countryTextInput.text)" label="Add Country to Collection"/>
      <mx:List dataProvider="{myCollection}" width="200"/>
 </mx:Application>



3、 将datagrid中的数据拖入到chart中显示
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" horizontalAlign="center" layout="vertical" creationComplete="init()">
<mx:Script>
	<![CDATA[
		import mx.controls.Alert;
		import mx.controls.DataGrid;
		import mx.events.DragEvent;
		import mx.core.UIComponent;
		import mx.managers.DragManager;
		import mx.core.DragSource;
		import mx.collections.ArrayCollection;
		
		//DataGrid的数据源
		[Bindable]
        private var medalsAC:ArrayCollection = new ArrayCollection( [
            { Country: "USA", Gold: 35, Silver:39, Bronze: 29 },
            { Country: "China", Gold: 32, Silver:17, Bronze: 14 },
            { Country: "Russia", Gold: 27, Silver:27, Bronze: 38 } ]);
            
        //ColumnChart的数据源, 默认为空    
        [Bindable] 
        private var chartData:ArrayCollection = new ArrayCollection()
        
        private function init():void{
        	
        	//让columnChart监听拖拽事件  	
        	column.addEventListener(DragEvent.DRAG_ENTER,dragEnterHandle)
        	column.addEventListener(DragEvent.DRAG_DROP,dragdropHandle)
        }
        
        //因为只有DataGrid推拽,所以直接允许,如果界面上有多个控件监听拖拽事件,需要判断后允许正确的数据进入
        private function dragEnterHandle(e:DragEvent):void{
        	DragManager.acceptDragDrop(e.currentTarget as UIComponent)
        }
        
        //拖拽放开后处理
        private function dragdropHandle(e:DragEvent):void{
        	//如果Column Chart中已经存在相同数据,报错返回
        	if(chartData.contains((e.dragInitiator as DataGrid).selectedItem)){
        		Alert.show("数据已经存在");
        		return;
        	}
        	//往column chart的dataprovider中添加拖拽数据。
        	//如果只需要特定的数据进入column chart,可以先做数据筛选。
        	chartData.addItem((e.dragInitiator as DataGrid).selectedItem)
        }
        
        
            

	]]>
</mx:Script>

<!--允许Grid拖拽数据-->
<mx:DataGrid dragEnabled="true" dataProvider="{medalsAC}" >
<mx:columns>
	
	<mx:DataGridColumn dataField="Country" />
	<mx:DataGridColumn dataField="Gold" />
	<mx:DataGridColumn dataField="Silver" />
	<mx:DataGridColumn dataField="Bronze" />
		
</mx:columns>
	
</mx:DataGrid>

 <!-- 定义颜色 -->
    <mx:SolidColor id="sc1" color="yellow" alpha=".8"/>
    <mx:SolidColor id="sc2" color="0xCCCCCC" alpha=".6"/>
    <mx:SolidColor id="sc3" color="0xFFCC66" alpha=".6"/>

<!-- 定义颜色 -->
    <mx:Stroke id="s1" color="yellow" weight="2"/>
    <mx:Stroke id="s2" color="0xCCCCCC" weight="2"/>
    <mx:Stroke id="s3" color="0xFFCC66" weight="2"/>

<!--Column chart设置成能解析Country: "Russia", Gold: 27, Silver:27, Bronze: 38这样的数据项-->
<mx:ColumnChart id="column" 
            height="200" 
            width="300" 
            paddingLeft="5" 
            paddingRight="5" 
            showDataTips="true" 
            dataProvider="{chartData}"
        >                
            <mx:horizontalAxis>
                <mx:CategoryAxis categoryField="Country"/>
            </mx:horizontalAxis>
            <mx:series>
                <mx:ColumnSeries 
                    xField="Country" 
                    yField="Gold" 
                    displayName="Gold"
                    fill="{sc1}"
                    stroke="{s1}"
                />
                <mx:ColumnSeries 
                    xField="Country" 
                    yField="Silver" 
                    displayName="Silver"
                    fill="{sc2}"
                    stroke="{s2}"
                />
                <mx:ColumnSeries 
                    xField="Country" 
                    yField="Bronze" 
                    displayName="Bronze"
                    fill="{sc3}"
                    stroke="{s3}"
                />
            </mx:series>
        </mx:ColumnChart>
	
</mx:Application>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics