`
may_cauc
  • 浏览: 43802 次
社区版块
存档分类
最新评论

flex之弹出窗口数据传递

    博客分类:
  • flex
 
阅读更多

弹出窗口:
利用PopUpManager我们可以把flex容器组件作为一种弹出窗口,这样也是便于我们将程序分块编写的方式之一。我们通常会自定义一个容器组件,作为弹出窗口的内容。
举一个例子来说明我们可能利用弹出窗口的地方。

我们做用户信息的增删改查。第一步我们会做一个Module,用于布置datagrid组件和增删查三个按钮,那么在这个Module中我们的datagrid主要就是用于显示查询到的用户数据列表。那么增加按钮事件就是我们弹出一个窗口来编辑数据,完成后在该弹出窗口中点击确定按钮,数据将传送给Module的一个函数。并由这个函数与后台交互,最终使数据通过后台添加到数据库。那么这是弹出窗口向父窗体传递数据的例子,另外我们在Module的datagrid中双击选中的数据,也会弹出窗口,并将该条datagrid的这条记录数据显示在弹出窗口的相应输入框中,供用户编辑。当然这就是父窗体向弹出窗口传递数据的例子了。
在flex中,我所知道的父子窗口传递数据有两种,姑且先让我这么命名并区分它们:一种是事件处理型,另一种就是函数绑定型。
第一种方式(事件处理型):先看代码,假设我们已经自定义好弹出窗体组件。那么看我们怎么在Module(也就是父窗体)中来调用弹出窗体的。
 1protected function button1_clickHandler(event:MouseEvent):void{
 2 //这里是新创建一个弹出窗体对象,UserWin为自定义的一个容器组件对象
 3         var win:UserWin = new UserWin(); 
 4    var user:TblBsUserType = new TblBsUserType();
 5//将user对象传递给弹出窗体,其中data为win里头的一个空对象。在win里边的代码是public data:Object={};
 6    win.data.user = user;
 7//通过这种方法给win添加一个事件监听器
 8    win.addEventListener("sendData",onSendData);
 9                PopUpManager.addPopUp(win,this,true); 
10                PopUpManager.centerPopUp(win);
11            }

12
13private function onSendData(e:Event):void{
14                var user:UserType = e.currentTarget.data.user;
15                Alert.show(ro.toString());
16            }
如上注释,我们父窗体向子窗体传递数据的时候其实就是像子窗体的一个已存在的对象中动态添加数据属性即可。这一点是ecmascript的规范,也是他的一个很好的优点。
最后那个方法,其实就是我们处理弹出窗口传数据给父窗体的一个处理过程,其实很简单,为了解耦,我们一般不会在弹出窗口中做数据的处理过程,而是直接由弹出窗口传回数据,交给父窗体处理。那么事件分发处理的方式,显而易见就是我们在创建弹出窗体对象的时候,动态的给子窗体注册一个事件监听器,,然后弹出窗体的确定按钮中调用dispatchEvent(new Event("sendData"));即可将数据传回给父窗体中定义的那个事件处理函数去处理。其中e.currentTarget表示当前正在使用某个事件侦听器处理 Event 对象的对象。也就是上边的win对象。
第二种函数绑定型,其实就是很简单,我们知道在ecmascript中函数也是一种变量,那么就可以利用这一点将函数作为一个变量传递给弹出窗体,同样可以达到我们处理的效果,
代码如下:
 1protected function button1_clickHandler(event:MouseEvent):void
 2            {
 3                var win:UserWin = new UserWin(); 
 4                var user:TblBsUserType = new TblBsUserType();
 5                win.data.user = user;
 6                win.data.send = add;
 7                //win.addEventListener("sendData",onSendData);
 8                PopUpManager.addPopUp(win,this,true); 
 9                PopUpManager.centerPopUp(win);
10            }

11
12//结果处理函数
13private function add(user:TblBsUserType):void{
14                if(null != user.butyId && "" != user.butyId){
15                    ro.addUser(user);
16                }

17            }


那么在弹出窗体中我们只需要调用data.send(data.user);就可以了。

备注:其实以上两种方法,为了使用方便,其实都还可以优化的地方,比如,事件处理方式,我们还可以在自定义组件中声明事件
<fx:Metadata>
  [Event(name="sendData",type="flash.events.Event")]
 </fx:Metadata>
让使用组件的mxml文档也能显示注册事件,如:<user:UserWin x="115" y="231" sendData=“sendDataHandler(event)”>
 </user:UserWin>

另外,在函数处理方式上,我们是利用函数绑定到对象的方式,来处理数据的,其实,为了使用接口的人更明确一些,我们可以把这个函数预先定义为组件的属性,比如:[Bindale]public var sendData:Function;这样在创建组件对象的地方,就可以明确的把用户自定义的处理函数赋值给这个属性(sendData)。
总之:不管怎么样,事件处理和函数处理都可以完成我们的要求,任选其一即可。

 

[转]http://www.blogjava.net/samyang/articles/317950.html

分享到:
评论

相关推荐

    Flex 弹出窗口的数据传输

    总的来说,理解并实现Flex弹出窗口的数据传输需要掌握Flex组件模型、事件处理机制以及数据共享的方法。在实际开发中,应根据项目需求选择合适的数据传递策略,同时考虑性能和可维护性。对于“博文链接:...

    Flex--主程序与弹出窗口之间传递数据

    这个主题聚焦于“Flex中主程序与弹出窗口之间的数据传递”。在Flex应用开发中,经常需要在主应用程序和弹出窗口(如对话框)之间交换数据,以便实现更加复杂的交互逻辑。 一、Flex中的组件层次结构 在Flex中,应用...

    flex 自动弹出窗口(右下角弹出,右上角弹出)

    本篇文章将详细探讨如何实现“自动弹出窗口”,特别是右下角和右上角弹出的窗口效果,以及与之相关的Flex技术。 首先,Flex是一种开源的开发框架,主要用于构建富互联网应用程序(RIA)。它基于ActionScript语言,...

    flex仿qq右边弹出提示消息功能

    通过实例化PopUpManager并传递组件作为参数,可以将任何Flex组件作为弹出窗口显示。 实现QQ风格的弹出消息,我们需要关注以下几个关键点: 1. **动画效果**:QQ的弹出消息通常伴随着平滑的动画效果,如淡入淡出、...

    Flex弹出窗口请求Action函数示例

    根据给定文件信息,下面详细阐述Flex弹出窗口请求Action函数相关知识点。 首先,“Flex”是一种使用基于MXML和ActionScript的富Internet应用程序开发的框架,用于构建具有复杂用户界面的应用程序。Flex应用程序通常...

    Flex打开新窗口将主窗口数据传给子窗口然后返回

    PopUpManager类是用于管理Flex中的弹出窗口的一个类。它提供了一些方法来添加、移除和管理弹出窗口。例如,在本例中,我们就使用了"PopUpManager.addPopUp(wnd,this,false);"方法来以非模态方式弹出子窗口。 知识点...

    flex TitleWindow之间数据传输

    本文将深入解析如何利用TitleWindow组件进行数据传输,包括从主应用向弹出窗口传递数据以及反之亦然的过程。通过实际代码示例,我们将逐步探索这一机制的工作原理。 #### 主应用向TitleWindow传递数据 首先,我们...

    fusioncharts for flex

    你可以添加事件监听器来响应这些交互,以实现更丰富的功能,比如弹出详细信息窗口或者更新图表数据。 5. **动态数据加载**:如果你的数据是动态变化的,可以使用FusionCharts的`updateChart()`方法来实时更新图表。...

    FLEX问题总汇 (总结篇)

    使用`PopUpManager.centerPopUp()`方法可以将弹出窗口居中显示,例如`PopUpManager.createPopUp(DisplayObject(Application.application), TitleWindow, true);` 以上就是关于FLEX的常见问题及解决方案的详细总结...

    FLEX TitleWindow之间数据传输的示例

    在Flex中,弹出窗口通常是使用TitleWindow组件来实现的。TitleWindow是一个容器组件,它显示了一个标题栏和内容区域,用来创建自定义的窗口界面。 当我们在Flex应用程序中需要在主窗口和TitleWindow之间进行数据...

    Flex试题 .txt

    Flex的Alert类默认不支持直接展示图片,但可以通过自定义Alert组件或者使用更高级的弹出窗口类(如ModalWindow)来实现这一需求。 ### 17. 解释Flex的单例模式和静态模式的区别,以及在AS中如何实现? 单例模式...

    FLEX常见问题总汇

    15. **PopUpManager居中**:利用`PopUpManager.centerPopUp()`方法可以将弹出窗口居中显示,如`PopUpManager.createPopUp(DisplayObject(Application.application), TitleWindow, true);` 16. **跨域访问**:为了...

    Flex父子窗口相互调用实现思路及

    在父窗口的代码中,我们注意到使用了`PopUpManager`类,这是一个用于管理弹出窗口的类,它提供了添加、移除、定位弹出窗口的方法。此外,`ArrayCollection`用于数据绑定,`DataGrid`用于展示数据,而`DataGridColumn...

    flex3的cookbook书籍完整版dpf(包含目录)

    弹出窗口的显示和位置 2.13节. 自定义弹出式窗口边框 2.14节. 处理focusIn和focusOut事件 第三章容器(65) 3.1 节使用布局管理器布置子组件 3.2 节通过百分比方式配置容器的布局和尺寸 3.3节. 以不同的坐标系统...

    Flex新手教程_入门级学习笔记

    - **弹出菜单**:提供上下文相关的选项。 #### Flex美化应用 - **组件样式**:使用样式表来统一和美化界面。 - **动画效果**:利用行为 (`Behavior`) 来添加动态效果。 - **皮肤**:自定义组件的外观。 #### Flex...

    flex中使用的一些小知识

    - **应用场景**:通常在完成某项操作后需要关闭弹出窗口的情况下使用。 ### 6. Alert对话框的透明度设置 ```as3 Alert { modalTransparency: 0.0; modalTransparencyBlur: 0; } ``` - **功能**:自定义Alert...

Global site tag (gtag.js) - Google Analytics