`
strugglesMen
  • 浏览: 115232 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

Flex绑定机制用法揭秘

阅读更多

    在学习Flex的过程中,你可能会遇到Flex绑定机制的概念,这里和大家分享一下,在我们了解了事件机制后,那么理解Flex绑定就不难了,Flex绑定其实也是事件机制的运用。

    Flex绑定机制

    在我们了解了事件机制后,那么理解Flex绑定就不难了,Flex绑定其实也是事件机制的运用。

    1.什么是Flex绑定

    Flex绑定的原理就是事件,在被Flex绑定的对象上增加了改变事件的监听,一旦某个被Flex绑定对象改变后,就会分发一个“propertyChange”事件(默认的,也可以改变成自己定义的事件),在其他组件中,会有propertyChange的事件监听,当捕捉到该事件后,则会去更新组件的属性并显示。

    Flex绑定的作用在于,将Flex中的变量、类、方法等与组件的值进行Flex绑定。例如,一个变量如果被Flex绑定后,那么引用该变量的组件的相关属性也会发生改变。我们用一个实例来表示

  1. <?xmlversionxmlversion="1.0"encoding="utf-8"?> 
  2. <mx:Applicationxmlns:mxmx:Applicationxmlns:mx=http://www.adobe.com/2006/mxmllayout="absolute"xmlns:comp  
  3. > 
  4. <mx:Script> 
  5. <![CDATA[  
  6. importmx.controls.Alert;  
  7. [Bindable]  
  8. privatevarisSelected:Boolean;  
  9. privatefunctionclickHandler(e:MouseEvent){  
  10. //Alert.show(e.currentTarget.toString());  
  11. isSelected=isSelected?false:true;//这句话的意思是如果isSelected为true,改变它为false,如果它为false,改变它为true;  
  12. Alert.show(isSelected.toString());  
  13. }  
  14. ]]> 
  15. </mx:Script> 
  16. <mx:Buttonidmx:Buttonid="testBtn"click="clickHandler(event)"label="测试"/> 
  17. <mx:CheckBoxxmx:CheckBoxx="60"selected="{isSelected}"/> 
  18. </mx:Application> 
  19.  

上述程序的效果就是,当点击button时,button不是直接改变checkbox的选中状态,而是改变isSelected这个变量,由于isSelected是被Flex绑定了的,那么会关联的改变CheckBox的选中状态。

这样看起来有些多此一举,完全可以直接改变checkbox的selected属性,我只是为了演示一下效果。如果说你的checkbox是动态构造的上百个,你不会去一个个的改变他吧。

◆因此,我们多数会将一个数据源进行Flex绑定声明,这样引用了这个数据源的控件,比如datagrid,在数据源发生了改变时,即使你不重新设置dataProvider,列表的数据也会刷新。当然,还有很多应用等待你去尝试。

如果这个代码中取消了[Bindable]的声明,会怎么样?isSelected不会改变了吗?

isSelected会改变,我们alert出来的结果也会显示结果改变了,但是checkbox的选择状态不会改变,因为当一个组件由创建到最终显示出来时是经过很多方法的,比如addChild,commitProperties,updateDisplayList等,updataDisplayList则是类似刷新显示效果一样的方法。

仅仅改变属性,而不去更新显示效果那么组件不会因为属性的改变而发生任何变化。Flex绑定的原理也是利用的事件分发,更复杂的Flex绑定有待你去自己发现了。

分享到:
评论

相关推荐

    flex数据绑定的原理

    在Flex开发中,数据绑定(Data Binding)是一种强大的机制,它允许UI组件的状态与应用程序的数据模型之间自动同步。数据绑定的原理是通过监听数据源的变化,并自动更新与之绑定的UI组件,反之亦然,从而简化了代码并...

    FLEX资源——FLEX数据绑定专题(中文PDF)

    《FLEX数据绑定专题》是一本深入探讨Adobe Flex中数据绑定技术的专业中文PDF文档。Flex是一种用于构建富互联网应用程序(RIA)的开放源码框架,它允许开发者创建交互性强、功能丰富的Web应用。数据绑定是Flex中一个...

    flex安全机制详解

    ### Flex安全机制详解 #### 一、Flex安全机制概述 Flex是一种用于构建高效且美观的Web应用程序的技术,它能够提供丰富的用户体验。为了确保安全性,Flex采用了一套完整的安全机制来控制不同域之间的通信,其中包括...

    flex数据绑定 pdf

    Flex数据绑定是Adobe Flex框架中的核心特性之一,它允许开发者将UI组件的显示状态与应用程序的数据模型紧密关联,实现数据的动态更新。这份名为“FLEX数据绑定专题”的PDF文档,很可能深入探讨了这一主题,提供了...

    flex事件机制的demo

    Flex ActionScript3.0事件机制的Demo, 举例说明了事件的三个阶段,事件的派发,事件的侦听,事件的拦截,自定义事件等相关知识点. 以上知识点在Demo中都有体现,初学者请仔细分析代码,加强理解,多调试、修改、验证以加深...

    FLEX数据绑定四种方式

    ### FLEX数据绑定四种方式详解 #### 一、概述 数据绑定是现代应用程序开发中一个重要的概念和技术。在Flex框架中,数据绑定被广泛应用来连接数据源与用户界面(UI)元素,使得数据能够实时更新并反映到界面上。本文将...

    flex绑定资源文件1

    本话题主要探讨如何在Flex中绑定资源文件,尤其是关于在按钮中嵌入icon图标的两种方法。 首先,Flex是一种基于ActionScript的开放源代码框架,用于构建富互联网应用程序(RIA)。它允许开发者创建具有交互性和动态...

    Flex数据绑定专题

    ### Flex数据绑定专题详解 #### 一、数据绑定概述 数据绑定是Flex应用程序开发中的核心...无论是使用简单的MXML大括号语法还是更复杂的ActionScript编程,开发者都能够根据实际需求选择最合适的方法来实现数据绑定。

    Flex事件机制(通俗易懂)

    ### Flex事件机制详解 #### 一、引言 Flex是一个强大的框架,用于构建高性能的Web应用程序。对于初学者而言,理解和掌握Flex中的事件机制是非常重要的一步。本文将深入探讨Flex事件机制的基础概念、事件注册通道、...

    Flex 事件机制,flex入门学习

    【Flex 事件机制详解】 Flex 事件机制是 Flex 应用程序中不可或缺的一部分,它使得组件之间能够有效地通信,响应用户交互以及管理应用程序状态。在深入理解 Flex 事件机制之前,我们需要先了解一下基本概念。 1. *...

    Flex事件机制详细说明

    ### Flex事件机制详解 #### 一、事件简介 在Flex框架中,事件是应用程序与用户交互的核心机制之一。它可以由多种触发源启动,包括但不限于用户的输入(如键盘按键、鼠标点击)、外部数据加载完成(例如WebService...

    flex数据绑定

    Flex中的数据绑定机制会捕获一系列常见的错误,包括但不限于: - `Error#1006: Call attempted on an object that is not a function.` 当尝试对非函数对象执行调用时触发。 - `Error#1009: null has no properties...

    flex itemRenderer 渲染机制的概念和使用

    Flex中的itemRenderer是一种关键的组件渲染机制,它允许开发者自定义列表或数据集项的显示方式。在Flex应用中,特别是在处理数据集如ArrayCollection时,我们常常需要以不同的方式展示每个项目,例如图片、文本或者...

    FLEX简单的入门快速总结

    在Flex中,数据绑定是一种强大的机制,它允许开发者将UI组件的属性与应用中的数据模型进行关联。当数据模型发生变化时,UI会自动更新;反之,用户对UI的操作也能反映到数据模型上。这种特性极大地简化了开发过程,...

    flex事件机制分析

    在Flex中,有两种方式添加事件监听器:使用`addEventListener`方法或在MXML组件标记中使用`event`属性。`addEventListener`允许动态添加和移除事件监听器,而MXML则提供了更直观的声明式绑定。事件处理程序通常包含...

    FLEX数据绑定专题

    在Flex客户端,可以使用HTTPService或WebService组件来调用这些远程方法,例如: ```mxml (event)" /&gt; ``` 当Java服务返回数据时,Flex客户端可以通过数据绑定将这些结果展示在UI组件上。例如,如果HTTPService...

    flex 数据绑定 dataGrid.rar

    下面我们将深入探讨Flex数据绑定的原理和DataGrid的使用方法。 一、Flex数据绑定 1. **基础概念**:数据绑定是连接两个属性的过程,其中一个属性的变化会自动反映到另一个属性上。在Flex中,我们可以使用`{}`符号...

    Flex初级数据绑定代码

    通过分析HelloWorld2.mxml文件,我们将深入了解Flex中的数据绑定机制及其基本用法。 #### 二、Flex与数据绑定 Flex是一种用于构建跨平台富互联网应用(RIA)的软件框架,支持多种编程语言和技术栈。数据绑定是Flex的...

    flex事件机制的分发

    Flex事件机制是Adobe Flex框架中一个关键的概念,它允许组件之间通过事件进行通信。在Flex中,事件机制的分发主要包括三个主要阶段:捕获阶段、目标阶段和冒泡阶段。下面将详细介绍这些阶段以及自定义事件的创建与...

    Flex tree的用法

    让我们深入了解一下Flex Tree的用法以及与XML数据结合的方式。 1. **Flex Tree的基本用法** - **创建Tree组件**: 在Flex中,你可以通过在MXML或ActionScript中定义`mx.controls.Tree`组件来创建Tree。 - **数据...

Global site tag (gtag.js) - Google Analytics