`

FABridge

    博客分类:
  • Flex
阅读更多
使用方法:

解释:
        1. 由于swf(基于actionscript)本身是编译文件, 属于二进制文件, 所以每次对actionscript以及mxml文件的改变必须编译一遍然后 才能测试
        2. 查看ajax bridge的文件只能在html server上, 无法在flex里直接查看(如果flex本身有机制也可以, 现在不知道)。 如果想直接查 看必须对文件做出改变, 具体改变方法见附录1

具体步骤:
        1. 在flex工程下右键选择Create Ajax Bridge
        2. 在对话框里选择需要同js通讯的文件(AS类或者MXML文件), 系统会自动建立相关文件以及文件夹(主要是被选择文件同级目录 bridge, 以及application根目录下的AjaxBridge文件夹),并自动在被选择的文件里建立Bridge类的实例, 系统会默认建立命名控件ns1,  建议更换为别的有意思的名字
        3. 在AjaxBridge文件夹里,系统会自动建立对应于关联的actionscript类名称的文件夹,以及对应的js文件和html文件。比如对应的文 件为Main.mxml,AjaxBridge文件夹下面就会有Main文件夹, 同时建立Main.js, 以及Main对象(javascript对象), Main文件夹下有lib文件夹, 放FABridge.js文件
        4. AjaxBridge下Main文件夹的Main.html中嵌入swf文件的代码会有一项:
            <param name="flashvars" value="bridgeName=b_Main"/>
其中b_Main是js中FABridge的实例名称(实际命名方式都是b_加上as类的名称, 可以自己改动,但是会有别的地方随之改动)。 在Main.js 中, flex会自动帮你建好CallBack, 并在swf加载完成后把实例付给Main对象(javascript对象), MainReady方法里基本包括所有公用方法 , 用于得到mxml页面或as类的具体属性
        5. 具体的用户定义的as控件或者as代码函数一样可以用FABridge.b_Main.root()对象控制(下面付给变量b_Main)

可以实现的控制:(只讨论js控制as)
        1. 可以通过get方法得到类中的实例。 比如, 在MXML中创建一个button, id设置为myButton,使用b_Main.getMyButton()可以得 到该Button, 并且可以设置所有非只读属性, 得到所有公开属性。 也可以在设置事件监听器(可以为js的函数, 也可以是as的)
        2. 可以直接引用名称来引用as的函数, 比如 在MXML的script块创建一个show(param)的函数, 就可以在js中用b_Main.show (param)使用与控制。参数一般不建Canvas议使用复杂抽象的对象, 比如Canvas,DisplayObject等,因为js没有此类对象。 但是可以引用 as里现成的对象并作为参数传过去, 比如在script块建立一个Canvas的对象实例   public var myCanvas:Canvas = new Canvas;(必须为 public), 然后前面的show函数为 public function show(p:Canvas):void....,在js里使用b_Main.show(b_Main.getMyCanvas);
        3. 所有js中引用到的as实例的方法都是可以直接使用, 所有属性通过set方法设置, get方法调用。 比如对id为myButton的button,  使用b_Main.getMyButton()得到对象, 使用setLabel(string)设置label属性, 使用setStyle("color", "red")设置字体颜色为红色。

说明:
       1. 根据adobe官方的说明, 可以用js做一切as可以做的功能,  但是有些还是不能做到, 比如使用js给datargrid赋一个dataProvider。
       2. as类和MXML基本一致, 差别地方基本就是as类和MXML的差别
       3. 对as或MXML的改变必须编译后才能看到, js的变化刷新就可以了
       4. 所有错误基本都有出错提示, 也就是说所有对象函数的引用都传过来
       5. AJAX Data Services 使用LiveCycle Data Services' 同 Flex AJAX Bridge 结合, 具体什么不知道
       6. 由于swf现在需要时间, 所以所有的js代码必须检查. 个人建议添加如下代码: Main.isLoaded = false; 在MainReady函数结束处里设置Main.isLoaded = true;然后在每次使用时添加判断if(Main.isLoaded)(仅仅是建议)
      7. 还有, 就是在MainReady函数里并没有把FABridge.b_Main.root()赋给Main, 如果需要引用除了基本公有方法(MXML类中的Global Variables, 如getPageTitle)之外的方法,还是必须引用FABridge.b_Main.root(),建议直接赋给Main或者别的变量, 因为Global Variables并不常用, 反倒是自己建立的对象用的比较多

附录:
    1.  由于FABridge的文件在AjaxBridge下不能在flex的Run里面直接看, 如果有需要可以把AjaxBridge下js文件copy到bin-debug下, 并且把两个Main.html merge到一块(不直接采用FABridge的Main.html是因为debug还有里面AC_OETags.js和history文件夹下js,具体详细应用我也不知道)(不推荐这么做, 后患很大)
    2. 命名问题:比如Main.mxml里有2个button, id分别为myButton, MyButton, 在js里只能这么写FABridge.b_Main.root().getMyButton(),如果用getmyButton()会报错,get后面必须大写开头, 得到的对象是id为MyButton的,如果没有id为MyButton的button, 则上面FABridge.b_Main.root().getMyButton()得到的是id为myButton的button。 所以建议所有instance名称全部小写开头。 同时除了开头字母大小写都可以找到外, 别的地方全部大小写敏感, 比如id为mybutton,或者mYButton等用FABridge.b_Main.root().getMyButton()则会报错
    3. 看了这个你就知道silverlight怎么写了^_^, 不过是silverlight对应页面文件的代码也是js写的而已。
分享到:
评论

相关推荐

    ssh+flex 整合方式FABridge

    在本项目中,我们将探讨如何将SSH与Flex整合,通过FABridge实现数据交互。 **SSH框架详解** 1. **Struts**:Struts是Java EE中的一个MVC框架,负责处理HTTP请求并调度到相应的Action,进而更新模型和展示视图。它...

    Fabridge-沟通javascript与flex的桥梁

    《Fabridge:JavaScript与Flex之间的通信桥梁》 在Web开发中,经常需要在客户端的JavaScript与服务器端的Flex应用之间进行交互,以便实现更丰富的用户体验和动态数据交换。Fabridge,作为一个开源项目,正是为此...

    Flex 3 基础教程(7)

    FABridge 的核心在于两个文件:`FABridge.as` 和 `FABridge.js`。`FABridge.as` 是在 Flex 项目中编写的 ActionScript 代码,定义了 Flex 客户端的接口,而 `FABridge.js` 则是 JavaScript 端的实现,提供了与 Flex ...

    flex Cairngorm ,FABridgeDemo

    在此,我们主要探讨的是Flex中的Cairngorm框架以及FABridge库的使用,并通过一个名为FABridgeDemo的实例来深入理解这两个工具的结合应用。 Cairngorm是Adobe社区推出的一个轻量级MVC(Model-View-Controller)设计...

    flex 的 FABrideg与struts交互

    标题中的“Flex的FABridge与Struts交互”是指在Web开发中,使用Adobe Flex作为前端展示层,通过FABridge库与后端Struts框架进行数据通信的技术实践。Flex是一种基于ActionScript和Flash Player的开源框架,用于构建...

    Hello Flex Ajax通信实例

    本篇文章将深入探讨如何利用FABridge库来实现Flex与Ajax之间的通信,以及如何通过这种方式实现Flex和Ajax的相互控制。 首先,让我们了解Flex和Ajax的基本概念。Flex是由Adobe开发的一种基于ActionScript和MXML的...

    flex与ajax交互、flex与javascript交互.docx

    - 如果您使用的是FlexBuilder 3.0,则Flex-AjaxBridge的源文件位于`FlexBuilder3.0安装路径\sdks\moxie\frameworks\javascript\fabridge`。 - 如果您使用的是LiveCycle Data Services 2.5,则Flex-AjaxBridge的...

    flex解析浏览器地址

    flex解析浏览器地址,。与浏览器的通信能够让 你建立一个可以超越Flex 应用本身的应用程序...的工具——Adobe Flex Ajax Bridge (FABridge)和Joe Berkovitz 的UrlKit 之类的,但是本章旨 在说明Flex 核心框架里的功能。

    集成 Flex 与 Ajax 应用程序

    通过 FABridge,ActionScript(Flex 的编程语言)和 JavaScript 之间可以进行双向通信,使得 Flash 内容能够与 Ajax 应用程序中的数据和功能进行交互。 在开始集成之前,开发者需要准备以下工具和技能: 1. ...

    Flex-Ajax Bridge demo源码

    6. **源码分析**:在"fabridge"这个文件中,我们可以看到实现Bridge功能的源代码。这可能包括定义接口、建立通信通道、数据转换、事件处理等方面的代码。通过学习这些源码,开发者可以理解如何在实际项目中集成Flex...

Global site tag (gtag.js) - Google Analytics