`
zengweigang
  • 浏览: 12192 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
最近访客 更多访客>>
社区版块
存档分类
最新评论

Flex Bindable 的用法

阅读更多

什么是元数据(metadata):[Bindable]大概又是Flex用得最多的元数据了。

我就按自己的理解随便解释一下:首先要明白元数据不是语法的一部分,而是专门给编译器用的,说白了是告诉编译器做某些事情,学过java之类的应该知道。那Bindable来讲,它的作用是告诉 flex编译器,给某些某些东西建立绑定关系,flex编译器会在编译过程中给AS(flex编译器就是把mxml编译成as,再编译到swf,也可能直接编译倒swf,我这里假设有as这么个环节)加一点事件发生和处理之类的代码,由此绑定的关系便建立了,如果我们用纯粹as3代码来写也是可以实现的,就是太太太麻烦。
什么是绑定:
举个例子:给下面的public变量加上[Bindable]
[Bindable]
public var name:String = "";
作为一个public变量,肯定既可以被赋值,也能赋值给别的变量。绑定的作用就是,当name改变的时候(被赋值了),可能通知其它被name影响(赋值给它们)的变量发生改变。这里的“可能”就需要编译器来判断,这就是为什么元数据是给编译器用的原因了。在mxml里用{}的语法的地方就是绑定的对象,比如label={xxx.name},当name变化,label也跟着变化。这样,我们只是很简单的改变了name的值,由于有绑定,界面上的 label也跟着自动变化了,爽吧。
能用在哪里
三个地方:类, 变量, getter/setter。是不是public没有关系,private的就只能给自家用呗。用在Class上就是简单的给所有的public属性(包括变量,getter/setter,普通方法)加上 [Bindable],可是一般的方法不能用[Bindable]呀,于是一般就能看到flex给了个warning,直接无视:)。变量嘛就是上面讲的,很简单略掉。
用在只读,只写属性(getter/setter)上面
终于讲到关键地方了,因为getter和setter很像方法,用起来会有点不同。看看这个例子:

[Bindable] 
private var content:Array = new Array(); 
[Bindable] 
public function set _content(ct:String):void 
{ 
content = ct.split(SEP); 
} 
[Bindable] 
public function get _wholeText():String 
{ 
if(content.length == 0) 
{ 
return ""; 
} 
else 
{ 
var _w:String = ""; 
for(var i:int=0 ; i<content.length ; i++) 
{ 
_w += content[i] + "\r\n"; 
} 
return _w; 
} 
} 

 

原来的设想是content绑定_wholeText,可它是不工作的。为什么?_wholeText太复杂了,被编译器排除在“可能”之外,编译器认为没有绑定关系,如果只是简单的return content,倒是可以的。我这里搜到了一些比较权威的解释。来自http://www.rubenswieringa.com/blog/binding-read-only-accessors-in-flex找到Ely Greenfield讲的。
Now keep in mind that there's no way for the compiler to actually tell if the value of a property get function would be different if called, short of doing an extensive code flow analysis of the get function, identifying all the inputs that might be affecting the value of the get function (i.e., member fields, statics, globals that are used in the get function and in any methods, global functions, closures, etc) it might call, and setting up watchers on every one of those to trigger the binding when any of them change. That's prohibitively difficult, and expensive to do. So the compiler doesn't try.
Instead when you put [Bindable] on a get/set property, the compiler makes it bindable with a little creative rewriting that allows the framework to watch the get function, and dispatch a change event when the get function is triggered. This means that automatic bindable properties don't work when the get function is computed from multiple values, or when you change its value by setting a backing field, rather than using the set function.
It _also_ means that if you have no set function, we can pretty much guarantee that there's no way automatically bindable get properties will be triggered. a read only propeerty is, to the compiler, completely opaque…at the moment, it has no idea where that value is coming from, and hence will never be able to ‘automatically' trigger the binding.
说白了就是为了降低复杂度和提高效率,复杂情况的getter会被忽略。如何解决?可以手动建立绑定,即[Bindable("eventName")]。把代码改成这样:

[Bindable] 
private var content:Array = new Array(); 
[Bindable] 
public function set _content(ct:String):void 
{ 
content = ct.split(SEP); 
this.dispatchEvent(new Event("_contectChanged")); 
} 
[Bindable("_contectChanged")] 
public function get _wholeText():String 
{ 
if(content.length == 0) 
{ 
return ""; 
} 
else 
{ 
var _w:String = ""; 
for(var i:int=0 ; i<content.length ; i++) 
{ 
_w += content[i] + "\r\n"; 
} 
return _w; 
} 
} 

 

这样就避免了编译器去自动识别。自己加上绑定关系,当_content被赋值,发出_contentChanged事件,通知所有被绑定的getter方法执行一遍。这也说明了,绑定不过是事件游戏而已,flex为用户隐藏了很多底层算法。

分享到:
评论

相关推荐

    总结flex各种用法

    绑定图片时可以使用`Bindable`和`Embed`注解,示例如下: ```actionscript [Bindable] [Embed(source="img/1.jpg")] public var phone1:Class; ``` ### 8. 日期中文标题 在Flex中,可以通过设置`mx:DateChooser`...

    flex 4 生命周期

    Flex 4的生命周期改进也体现在事件处理和元数据的使用上,例如` IOErrorEvent`和`StatusEvent`等事件,以及`[Bindable]`、`[SkinPart]`等元数据,这些都增强了组件与外部数据的交互和皮肤的自定义。 尽管Adobe提供...

    flex与JS交互示例

    - **Flex调用JavaScript**: 使用`ExternalInterface.call()`方法,将ActionScript函数的返回值传递给JavaScript。例如: ```actionscript var result:Object = ExternalInterface.call("JavaScriptFunction", ...

    细细品味Flex——新Flex学习手册.pdf

    - **工欲其善,先利其器(Flex Builder)**:介绍了如何使用Adobe Flex Builder进行Flex项目的开发,包括下载、安装、启动开发环境、创建“Hello World”项目及MXML编程模型。 - **建立扎实的ActionScript 3.0语法...

    flex tree 修改icon方法

    标题"flex tree 修改icon方法"正好指出了这一需求。在这个场景下,我们需要通过编程方式来实现对Tree节点图标的个性化设置。 首先,我们要理解Flex Tree的基本结构。Tree组件由一系列的TreeItemRenderer组成,每个...

    Flex与Java通过实体传递数据

    在Flex中,为了能够将前端的数据对象与后端的服务进行有效映射,通常会在Flex端定义一个实体类,并使用`Bindable`和`RemoteClass`注解来关联前后端的数据模型。 ```as [Bindable] [RemoteClass(alias=...

    Flex技术中AdvancedDataGrid使用方法

    ### Flex技术中AdvancedDataGrid使用方法 #### 一、多列排序 在默认情况下,`AdvancedDataGrid`组件会按照数据被添加至其`DataProvider`的顺序来展示数据。与`DataGrid`组件类似,`AdvancedDataGrid`也支持用户在...

    基于Flex的ArcGIS开发经典例子说明文档

    ### 基于Flex的ArcGIS开发经典案例详解 #### 案例一:ArcGIS.Server.9.3与...这些案例不仅涵盖了基本的地图浏览功能,还涉及到了更复杂的交互式操作,有助于开发者全面了解和掌握ArcGIS API for Flex的使用方法。

    Flex图片上传实例

    - **HTTP请求**:使用Flex内置的HTTP服务或第三方库发送POST请求来上传文件。 - **状态管理**:通过定义可绑定变量来跟踪上传过程的状态变化,如文件名、上传进度等。 - **错误处理**:处理可能出现的各种异常情况,...

    Flex4.5常见问题总结

    除了选择器设置组件外观,Flex还允许直接调用`setStyle`方法进行实时样式调整。效果(effect)用于实现组件的视觉变换,如淡入淡出、位移等,增强用户界面的动态感。 #### 八、数据绑定 数据绑定是Flex的核心特性之...

    FLEX和使用RemoteObject和后台通信

    `RemoteObject` 可以方便地将Flex应用程序中的ActionScript方法映射到服务器上的业务逻辑方法,从而实现数据的传递和交换。以下将详细讲解如何使用`RemoteObject`以及它的工作原理。 1. **配置Flex项目** 在Flex...

    自己整理的flex与java结合的学生管理系统-很好的入门及提升的例子

    5. 数据管理:在Flex客户端,数据通常被封装在Flex的Model类中,这些Model类通过Bindable注解与视图组件关联,当数据发生变化时,视图会自动更新。而在服务器端,数据管理通常涉及实体类(Entity)和DAO,实体类对应...

    flex学习心得

    除了使用选择器设置外观之外,Flex还允许直接通过调用`setStyle`方法来修改组件的样式属性。 #### 十、Flex 4中的类选择器 在Flex 4中,类选择器需要使用特定的命名空间,例如: ```css @namespace s "library://ns...

    flex remoteObject封装后和java通信

    例如,假设我们有一个名为`MyJavaClass`的Java类,其中包含一个名为`myServerMethod`的方法,我们需要在Flex客户端使用相同的名称来调用。 ```java public class MyJavaClass { public String myServerMethod...

    Flex和java交互的示例代码

    - 在部署时,还需要配置Flex客户端与Java服务器的通信设置,例如使用Cairngorm框架或 BlazeDS等工具。 综上所述,通过合理的架构设计和编码实践,Flex与Java可以高效地进行数据交互,从而构建出功能强大的Web应用...

    Myeclipse10搭建Flex4.6+spring3.0+mybatis3.2架构

    在本文中,我们将探讨如何使用Myeclipse10搭建Flex4.6、Spring3.0和Mybatis3.2的架构。这个架构是企业级开发中常见的技术组合,它允许开发者构建高性能、可扩展且易于维护的富互联网应用程序(RIA)。 1. **Flex4.6...

    FLex文档教程

    使用`[Bindable]`元数据标签声明可绑定的属性,这样当数据源发生变化时,UI会自动更新,无需手动刷新。 **五、Flex组件模型与协作** Flex的组件模型允许开发者和设计师进行分离式协作。组件设计可以独立于业务逻辑...

    flex combobox 输入过滤实例

    Flex Combobox是一款在Adobe Flex框架下使用的组件,它结合了下拉列表和文本输入框的功能,用户可以在输入框中输入文字,同时从下拉列表中选择一个匹配项。在本实例中,我们将深入探讨如何利用Flex 4实现Combobox的...

    sql flex (最简单的连接方式)

    例如,可以使用`RemoteObject`或`WebService`组件来调用后端的Java方法,这些方法可以执行SQL查询。 5. 连接配置:在描述中提到的文件如`newScript.as`, `personScript.as`, `personconfig.as`, `newconfig.as`可能...

Global site tag (gtag.js) - Google Analytics