`
wanfan2008
  • 浏览: 25661 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

深入分析Flex [Bindable] 以及使用方法

    博客分类:
  • Flex
阅读更多

[Bindable]大概又是Flex用得最多的元数据了。刚开始用用确实好简单,效率真是没的说。不过这几天用着却碰到了些问题,我自己搜集了些资料,想着有必要在blog里总结一下吧。
啥是元数据(metadata)

知道就跳过吧。今天不晓得为什么livedoc.adobe.com这么慢,没办法,拿不到权威的解释了。我就按自己的理解随便解释一下:首先要明白元数据不是语法的一部分,而是专门给编译器用的,说白了是告诉编译器做某些事情,学过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文件中使用html渲染文字等.txt

    通过本文,读者可以全面了解Flex框架下HTML文本渲染的方法与应用场景,以及如何结合Flex组件完成多媒体控制功能。 ### 一、Flex简介 Flex是一种开源的Web应用程序框架,用于构建桌面和移动设备上的高性能富互联网...

    Flex图片上传实例

    在本篇文章中,我们将深入探讨一个具体的Flex图片上传实例,并对其中涉及的关键技术点进行详细解读。此实例不仅提供了一个实际的上传图片的应用场景,而且还包含了一些实用的代码片段,这对于想要了解如何在Flex中...

    FLEX动态树 动态图表

    本文将深入解析如何在Flex中创建并自定义动态树,以及如何通过事件处理实现更高级的功能,如动态图表的构建。 #### 一、树形控件的自定义图标 在Flex中,树形控件允许开发者高度定制其外观,包括默认图标、打开和...

    Flex企业应用开发实战源代码

    再接着详细讲解了BlazeDS框架的使用方法和工作原理,并通过迭代的方式完整地演示一个真实的Flex企业级应用的开发全过程,实战性极强;最后重点探讨Flex应用性能优化等方面的高级知识。值得一提的是,本书公开了作者...

    flex [bindadle]标签数据绑定经典案例

    在探讨“Flex [Bindable]标签数据绑定经典案例”这一主题时,我们首先需要理解Flex框架以及数据绑定在其中的应用。Flex是一种用于构建跨平台富互联网应用程序(RIA)的软件框架,由Adobe Systems开发。它使用MXML...

    Flex读取excel

    本文将深入探讨如何使用Flex进行Excel文件的读取与写入操作,并基于提供的代码片段进行详细的分析。 #### 二、基础知识 1. **Flex概述**:Flex是一种开源框架,用于构建跨浏览器、跨平台的应用程序。它提供了丰富...

    Flex 实时曲线图(定时获取后台数据)

    在Flex中,创建实时更新的曲线图主要依赖于`setInterval`方法来定期执行某个函数,以及`mx:LineChart`组件来展示图表数据。 #### 1. `setInterval` 方法 `setInterval` 是JavaScript中的一个内置函数,它可以定期...

    flex 第一步的bug

    这些修正不仅有助于新手避免学习过程中的误区,还能帮助他们更深入地理解Flex的各项技术细节。通过仔细研究这些修正内容,学习者可以更快地掌握Flex的基本概念和技术要点,为后续的项目开发打下坚实的基础。

    Flex初级数据绑定代码

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

    flex创建的字体属性框

    通过上述分析,我们不仅了解了如何在Flex中创建字体属性框,还深入探讨了MXML与ActionScript的结合使用、数据绑定机制以及如何利用UI组件来实现字体属性的动态设置。这对于理解和开发类似的Flex应用程序非常有帮助。

    FLEX 数据绑定专题一(转)

    2. ActionScript数据绑定:在ActionScript代码中,可以使用Bindable元标签声明类的属性为可绑定的,然后使用`bindable`关键字定义绑定表达式。 数据绑定的应用场景: 数据绑定在FLEX中广泛应用于各种场景,包括但不...

    flex部分控件代码

    该代码展示了Flex中几种常用控件的使用方法,包括文本输入框、水平滑块以及复选框。通过这些控件的组合使用,可以实现较为复杂的用户交互逻辑。对于学习Flex框架的人来说,这是一段很好的实战代码,有助于理解Flex...

    log及相关日志

    日志可以分为静态日志分析、代码跟踪调试以及动态监测分析三种形式,其中静态日志分析是最基础且常用的日志处理方式之一。 #### 三、日志生成与分析 在Flex开发中,日志生成与分析主要涉及两种方式: 1. **通过`...

    OpenScales图层控制 DataGrid checkBox

    ### OpenScales图层控制与...通过对示例代码的分析,我们不仅了解了如何设置和配置这些组件,还深入探讨了如何解决实际应用中可能遇到的问题,如保持复选框状态不变等。希望本文能帮助您更好地理解并应用于您的项目中。

    AdaptiveUIPlayground:该示例演示如何使用Xamarin.Forms创建自适应UI

    5. **Custom Renderers**: 如果需要更深入的自定义,可以使用 Custom Renderers。这允许开发者为每个平台编写特定的渲染代码,从而实现更精细的控制,比如自定义控件外观或行为。 6. **SizeRequest 和 ...

Global site tag (gtag.js) - Google Analytics