`
hjy2099
  • 浏览: 261324 次
  • 性别: Icon_minigender_1
  • 来自: 福州
社区版块
存档分类
最新评论

Flex中Event与Bindable

    博客分类:
  • Flex
阅读更多

转自:http://liguoliang.com

Event:

1.事件派发 Dispatching

Flash.events.EventDispacher类提供了事件dispatch函数,如果需要dispatch事件,则应该考虑继承该类或其子类.如果不能继承该类,则应事先IEventDispatcher接口

2.监听事件 Listening to Events

在监听事件时应首先考虑是否要使用weak referenced.如果事件监听与派发与监听函数有共同的生命周期,则可以使用strong referenced,在其他的大部分情况下,则应使用weak referenced.
需要注意的是, 如果事件派发者属性为Public, 则在任何允许的地方都可以增加监听函数, 从而达到低内聚, 更易于操作.

 

Bindable的三种实现方式:

1.使用Event实现.

2.MXML中使用大括号实现.

3.AS中使用ChangeWatcher实现.

Event与Bindable举例:

image

有一个Person类:

 
package com.insprise
{
import flash.events.Event;
import flash.events.EventDispatcher;
import mx.events.PropertyChangeEvent; 

public class Person extends EventDispatcher
{
private var _name:String;
private var _age:int;
private var _desc:String;
/**
* 构造函数
*/
public function Person()
{
super();
}
/**
* Get&Set Name SetName时dispatch一个PropertyChangeEvent事件
*/
[Bindable(event="propertyChange")]
public function get name():String {
trace("Get name: " + _name);
return _name;
}
public function set name(name_:String):void {
if(name_ == _name) {
return;
}
var old:String = this._name;
this._name = name_;
trace("Set Name to: " + name_);
dispatchEvent(PropertyChangeEvent.createUpdateEvent(this,"name",old,name_));
}
/**
* Get&Set age; age被Set的时候会dispatch一个ageChanged事件.
*/
[Bindable(event="ageChanged")]
public function get age():int {
trace("Get age: " + _age);
return _age;
}
public function set age(age_:int):void {
if(age_ == _age) {
return;
}
var old:int = this._age;
this._age = age_;
trace("Set Age to: " + age_);
dispatchEvent(new Event("ageChanged"));

}
/**
* Get&Set Desc;desc被set时会自动dispatch一个PropertyChangeEvent.
*/
[Bindable]
public function get desc():String {
trace("Get desc: " + _desc);
return _desc;
}
public function set desc(desc_:String):void {
if(desc_ == _desc) {
return;
}
var old:String = this._desc;
this._desc = desc_;
trace("Set desc to: " + desc_);
}
}
}

现在我们通过上面提到的三种方式实现Bindable:

1.使用Event Bindable:

import mx.events.PropertyChangeEvent;
import com.insprise.Person;
var person:Person = new Person();
/**
* 监听PropertyChangeEvent与ageChanged事件
*/
private function init():void {
person.addEventListener("propertyChange",propertyChangeHandler);
person.addEventListener("ageChanged",ageChangedHandler);
}

/**
* 通过对PropertyChangeEvent.property判断是name还是desc被监听,更新屏幕
*/
private function propertyChangeHandler(e:PropertyChangeEvent):void {
if(e.property == "name") {
textArea_Name.text = e.newValue.toString();
}else if(e.property == "desc") {
textArea_Desc.text = e.newValue.toString();
}else {
return;
}
trace("view: " + e.property + " Changed");
}

/**
* set age之后更新屏幕
*/
private function ageChangedHandler(e:Event):void {
textArea_Age.text = String(person.age);
}

2.MXML使用大括号:

3.使用AS中的ChangeWatcher

private function init():void {   
  
    var nameWatcher:ChangeWatcher;   
  
    var ageWatcher:ChangeWatcher;   
  
    var descWatcher:ChangeWatcher;   
  
    var canWatche:ChangeWatcher;   
  
    //nameWatcher = BindingUtils.bindProperty(textArea_Name,"text",person,"name");   
  
    ChangeWatcher.watch(person,"name",nameSetter);   
  
    ageWatcher = BindingUtils.bindProperty(textArea_Age,"text",person,String("age"));   
  
    descWatcher = BindingUtils.bindProperty(textArea_Desc,"text",person,"desc",true);   
  
}   
  
private function nameSetter(e:PropertyChangeEvent):void {   
  
    if(e==null) {   
  
        return;   
  
    }   
  
    textArea_Name.text = e.newValue.toString();   
  
    trace("Name Changed by nameSetter on the Event " + e + " to " + e.newValue);   
  
}    
  
private function ageSetter(e:Event):void {   
  
    //textArea_Age.text = String(person.age);   
  
    trace("Age is setted by ageSetter on the Event " + " to " + person.age);   
  
}  
 
分享到:
评论

相关推荐

    Flex与Java通过实体传递数据

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

    Flex4 AIP 中文说明

    此外,还增加了 Bindable、Observer 和 Bindable Event 等元数据,让数据绑定更加灵活和强大。 5. **MXML改进**:MXML作为Flex的声明式语言,在Flex4中变得更加强大。它可以用来定义组件、事件处理函数甚至...

    flex实现 ComboBox中下拉checkbox

    本文将深入探讨如何在Flex中的ComboBox实现下拉列表中包含Checkbox的功能,并结合移动面板和可调整大小的面板实例,为你提供一个完整的解决方案。 首先,我们要理解Flex中的ComboBox组件。ComboBox继承自ListBase类...

    flex combobox 输入过滤实例

    protected function comboBox_textChangeHandler(event:FlexEvent):void { dataProvider.filterFunction = containsFilterFunction; dataProvider.refresh(); } private var containsFilterFunction:Function...

    flex中actionscript动态调用remoteobject类

    在Flex中,使用ActionScript动态调用RemoteObject类是一种常见的实现客户端与服务器端交互的方式。通过这种方式,开发者可以在客户端灵活地调用服务器端的服务,并处理返回的数据。下面将详细介绍如何在Flex中使用...

    Flex 3 Cookbook[中文版].pdf

    #### 一、Flex 与 ActionScript 基础 - **Flex 的组成**:一个典型的 Flex 应用程序由两部分组成——ActionScript 和 MXML。从 Flex 3 开始,ActionScript 成为了一个完全面向对象且类型安全的语言,并遵循 ...

    Flex分页技术

    在Flex开发中,数据展示通常会涉及到大量的数据处理,如分页、排序、过滤和关键字搜索等。在Flex中,我们可以使用DataGrid组件来实现这些功能,提高用户体验并优化性能。 1. **Flex DataGrid 分页技术**: Flex ...

    Flex4 Declarations in ActionScript

    《Flex4声明式编程在ActionScript中的应用探析》 Flex4是Adobe Flex框架的一个重要版本,它引入了全新的ActionScript编程模型,显著提升了开发效率和应用程序的表现力。本篇文章将深入探讨Flex4中的一项核心特性...

    FLEX动态树 动态图表

    ### FLEX动态树与动态图表:深入理解及应用 在Adobe Flex框架中,`Tree`控件被广泛用于展示层次结构的数据,如目录、组织结构等。本文将深入解析如何在Flex中创建并自定义动态树,以及如何通过事件处理实现更高级的...

    Flex Bind数据绑定实例代码

    message.addEventListener(FlexEvent.UPDATE, function(event:FlexEvent):void { trace("Data updated:", event.target); }); ``` 在这个例子中,我们创建了一个Label和一个数据对象,然后使用BindingUtils将它们...

    Flex DataGrid从XML文件中加载数据

    4. **XMLListCollection与ArrayCollection**:在AS3中,`XMLList` 类似于数组,可以用来存储XML节点的集合。`XMLListCollection` 是一个可绑定的数据集,可以作为 Flex UI 组件的数据提供者。`users.children()` ...

    Flex_2_中的元数据标签

    - **定义**:`[Bindable]` 是 Flex 2 中最常用的元数据标签之一,用于声明数据绑定。它可以应用于类成员变量,以便在变量值发生变化时触发事件,从而实现组件间的数据同步。 - **用途**: - **数据绑定**:通过 `...

    Flex4.5常见问题总结

    若希望某个对象作为数据绑定的源,需在其属性前加上`[Bindable]`或`[Bindable("eventname")]`标记,确保属性变化时能触发数据绑定事件。 综上所述,Flex4.5提供了丰富的工具和机制,帮助开发者构建高性能、高互动性...

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

    标题“sql flex (最简单的连接方式)”指的是如何在Flex应用中简便地与SQL数据库进行交互。以下是关于这个主题的详细知识点: 1. Flex简介:Flex是由Adobe开发的开源框架,主要用于创建具有动态图形、视频集成和交互...

    Flex Data Binding详解

    Flex Data Binding是Adobe Flex框架中的核心特性之一,它允许开发者创建数据驱动的应用程序,通过将UI组件的属性与数据模型的属性直接关联,实现实时的数据同步。在Flex中,数据绑定确保当数据源发生变化时,相关的...

    FLEX数据绑定专题

    在Flex开发中,数据绑定是一项核心特性,它允许开发者轻松地将用户界面组件与应用程序的数据模型关联起来。本文将深入探讨“FLEX数据绑定专题”,包括其多种实现方式以及如何结合Java作为后端来实现数据交换。 首先...

    Flex前端与Java服务端交互反射机制.doc

    《Flex前端与Java服务端交互反射机制》 在软件开发中,前端与后端的交互是必不可少的一部分。本文主要探讨了使用Flex作为富互联网应用程序(RIA)前端与Java服务端进行交互的反射机制。Flex以其丰富的用户体验和...

    flex4-binding-custom-Class.rar_flex_flex4

    在Flex 4中,数据绑定是通过ActionScript 3实现的,它基于一种声明性方式,使得UI组件的状态能够与应用程序的数据模型实时同步。数据绑定的核心概念是`<mx:Binding>`或`<s:Binding>`标签,但更常见的是直接在属性...

    Flex之URLLoader加载XML

    在Flex开发中,`URLLoader` 是一个非常重要的类,用于加载远程数据,如XML、JSON等。在本示例中,它被用来从服务器获取XML文件并将其内容解析为XML对象,以便在应用程序中使用。`Flex` 是Adobe开发的一个开放源代码...

Global site tag (gtag.js) - Google Analytics