`

个人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>
分享到:
评论

相关推荐

    Flex个人知识库之Apple组件

    "Flex个人知识库之Apple组件"这个标题暗示了这是一份关于使用Adobe Flex技术来构建针对Apple设备应用的知识资源。Flex是一种开源的、基于ActionScript的框架,用于创建富互联网应用程序(RIA),尤其适用于构建跨...

    Flex个人知识库(3)

    【Flex个人知识库(3)】是一个集合了与Flex相关技术知识的资源包,其中包含了一个名为"CloudMonitor"的子文件。Flex是一种用于构建富互联网应用(RIA,Rich Internet Applications)的技术,由Adobe公司开发,它允许...

    FLEX开发中文文档

    这份文档由四部分组成,分别对应四个章节,旨在帮助开发者理解和掌握Flex的相关知识,同时融入了作者的个人理解和实践经验,以更贴近中文读者的理解习惯。 第一部分,"Flex中文帮助No1-2章.pdf",可能包含了Flex的...

    好看的FLEX相册

    1. **Flex SDK**:Flex开发的基础是Flex Software Development Kit(SDK),它包括编译器、库和工具,允许开发者使用MXML和ActionScript编写Flex应用程序。 2. **MXML**:MXML是Flex中的标记语言,类似于HTML,用于...

    java flex开发项目配置实例

    【Java Flex 开发项目配置实例】教程旨在帮助开发者快速搭建基于Java和Flex的开发环境,实现两者间的交互。...要深入学习Java Flex开发,还需要掌握ActionScript、MXML、BlazeDS配置、Spring框架集成等更多知识。

    flex3

    3. **Flex SDK**: Flex SDK是开发Flex应用程序的基础工具集,包括编译器、Flex Builder插件、Flex组件库等。开发者可以免费下载和使用,创建自定义组件或者扩展已有组件。 4. **Flex Compiler**: Flex编译器负责将...

    Flex ™ Builder 2

    ### Flex™ Builder 2 使用指南知识点详解 #### 一、Flex™ Builder 2 概述 **Flex™ Builder 2**是由Adobe Systems Incorporated发布的一款专为开发基于Adobe Flex框架的应用程序而设计的强大集成开发环境(IDE)...

    FlexBuilder2帮助文档

    1. **FlexBuilder2界面**:了解FlexBuilder2的工作区布局,包括编辑器、项目浏览器、属性检查器、控制台和调试器等组件的位置和功能,有助于提高开发效率。 2. **MXML语言**:MXML是Flex的主要标记语言,用于声明...

    一些关于flex的示例网站

    - **组件和容器**:Flex提供了丰富的UI组件库,包括按钮、文本框等,以及容器用于组织这些组件。 - **数据绑定**:Flex支持强大的数据绑定机制,允许UI组件与数据模型自动同步更新。 ### 2. Flex and Java ...

    Flex 一些个人认为不错的案例

    1. **Flex SDK**: Flex软件开发工具包提供了构建RIA所需的一切,包括编译器、MXML和ActionScript库。开发者可以使用Flex Builder(现为Flash Builder)作为IDE,或者选择命令行工具进行开发。 2. **MXML**: MXML是...

    Flex插件plugin1

    9. **文档和教程**:内置相关文档和教程资源,方便开发者随时查阅Flex和ActionScript的相关知识。 10. **社区支持**:可能与开发者社区紧密相连,提供插件更新、问题解答和用户反馈的功能。 由于我们只有一个...

    blog.zip_flex_flex blog

    **Flex知识点:** 1. **MXML和ActionScript**:Flex使用MXML作为声明式语言来构建用户界面,同时结合ActionScript进行程序逻辑编写。 2. **Flex组件库**:包括按钮、文本框、面板等UI元素,用于构建用户界面。 3. **...

    flex嵌入jsp心得

    标题与描述概述的知识点是关于如何将Flex框架嵌入到JSP页面中,以实现更丰富的数据可视化功能,特别是图表的展示。以下是基于标题、描述、标签以及部分内容的详细解析和扩展。 ### Flex嵌入JSP开发心得 #### 1. ...

    Flex 项目安装备份文件

    本文将深入探讨“Flex项目安装备份文件”的相关知识点,以及如何管理和保护您的源代码。 首先,我们需要理解“Flex项目”是什么。Flex项目是使用Flex Builder或Flash Builder等集成开发环境(IDE)创建的应用程序,...

    Flex实现动态仪表盘

    在Flex中,我们可以利用各种组件库来创建这些图形,例如Spark或MX组件集。Spark组件提供了更加现代和可定制的设计,而MX组件则更为成熟且功能丰富。 1. **数据源的连接**:首先,你需要一个数据源,可能是数据库、...

    Flex入门教程(PPT格式的) 个人觉得不错

    1. **Flex简介**:Flex是一种基于XML的标记语言,用于创建具有丰富用户体验的Web应用程序。它允许开发者在服务器端处理数据,而在客户端显示动态、交互的内容。Flex SDK提供了强大的组件库,包括按钮、文本输入、...

    Flex4权威指南英文原版高清晰

    1. **强大的用户界面组件库**:Flex4提供了丰富的UI组件,可以轻松构建美观且功能完善的用户界面。 2. **高性能渲染引擎**:利用Adobe AIR和Flash Player等技术实现高效渲染,确保应用程序运行流畅。 3. **跨平台...

    百度地图 Flex 和示例程序

    在这个名为"百度地图 Flex 和示例程序"的压缩包中,包含两个关键文件:`示例程序.mxml`和`BMap.swc`,它们主要涉及了使用Adobe Flex技术与百度地图API进行集成的知识点。 首先,让我们了解一下Adobe Flex。Flex是一...

Global site tag (gtag.js) - Google Analytics