外界与Flex Application的交互处理（之嵌入html）

原帖http://space.zdnet.com.cn/html/84/289384-2787313.html

这个网站用firefox打开有毛病。。。

 

 

 

 

Flex采用IFrame嵌入html，可参考http://www.deitte.com/archives/2006/08/finally_updated.htm ，这是Brian Deitte写的一个IFrame. Control对象，非常好用。但在实际应用中，还会有一些问题，需要在外围解决。

 

（1）使用IFrame可能碰到的问题：不能随着窗口的位移或调整自动调整。

 

         我是在Popup的TitleWindow中，采用TabNavigator动态载入一些Tab，这些Tab页可能是Flex Container，也可能是IFrame. Control（也就是嵌入的iframe中html页面）。因为是扩展出的TitleWindow，允许调整大小和位移，但在调整大小和位移过程中，会造成 IFrame. 中的html页面不跟随移动。

         这个问题就必须额外监控mouse事件，刷新IFrame的invalidateDisplayList。

 

view plaincopy to clipboardprint?
<mx:TabNavigator id="nav" dropShadowEnabled="true" width="98%" height="100%" horizontalGap="0" change="checkIFrameTabPaneVisible(event)"/> 
<mx:TabNavigator id="nav" dropShadowEnabled="true" width="98%" height="100%" horizontalGap="0" change="checkIFrameTabPaneVisible(event)"/>

 

view plaincopy to clipboardprint?
override protected function oMouseUp(event:MouseEvent):void{  
    super.oMouseUp( event );  
        //cacheIFrameTabPanels是索引的当前TabNavigator中所有IFrame对象  
    for each(var panel:IFrame. in cacheIFrameTabPanels){  
        Container(panel).invalidateDisplayList();  
    }    
} 
override protected function oMouseUp(event:MouseEvent):void{
 super.oMouseUp( event );
        //cacheIFrameTabPanels是索引的当前TabNavigator中所有IFrame对象
   for each(var panel:IFrame. in cacheIFrameTabPanels){
  Container(panel).invalidateDisplayList();
 } 
}

 

（2）使用IFrame可能碰到的问题：Tab切换多次后，造成html页面悬浮，不切换。

          这时候，必须额外监控tabnavigator的change事件，将IFrame设置visible为false，（实际上就隐藏iframe中的html页面）。

 

view plaincopy to clipboardprint?
protected function checkIFrameTabPaneVisible(event:IndexChangedEvent):void{  
    var panel:DisplayObject = nav.getChildAt( nav.selectedIndex );  
        for each(var panel1:IFrame. in cacheIFrameTabPanels){  
        Container(panel1).visible = false;  
    }   
    if(panel is IFrame){  
        Container(panel).visible = true;  
    }  
} 
protected function checkIFrameTabPaneVisible(event:IndexChangedEvent):void{
 var panel:DisplayObject = nav.getChildAt( nav.selectedIndex );
        for each(var panel1:IFrame. in cacheIFrameTabPanels){
  Container(panel1).visible = false;
 }
 if(panel is IFrame){
  Container(panel).visible = true;
 }
}

 

（3）使用IFrame可能碰到的问题：Popup的TitleWindow关闭后，html页面仍悬浮。

             这个就简单多了，监听TitleWindow的close事件，将相应的IFrame. visible设置为false即可。

 

（4）IFrame并没有对嵌入的iframe和html做回收，这个需要自己扩展。

          IFrame中只是采用了visible来隐藏和显示iframe的内容。所以在实际应用中，需要对一些操作做回收，这个需要自己扩展。

评论

1 楼 baixiaozhe 2009-05-07  

http://blog.csdn.net/arshoon/archive/2008/06/11/2533982.aspx


Flex通常作为一个web项目的一部分嵌入到一个web页中，因此Flex程序和web页面的通信就变得非常重要。
1）  Flex提供了多种方法实现Flex程序和封装页面的交互，主要有：flashVars属性，查询字符串参数，navigateToURL()方法，以及flash.external.ExternalInterface类。
2）    Flex程序 获取环境信息：Application.application.url获取封装页面的URL，以及使用@ContextRoot()；以及可以通国 flash.system.Capacities获取到有关系统的一些信息，比如版本、语言、操作系统等；
3）    flashVars用来从外部封装页面向Flex程序传送数据：
         在封装页面传入参数值：AC_FL_RunContent(flashVars, “para1=value1&…&paran=valuen”)或者
<Object>
    <param name=”movie” value=”wrapper.swf? para1=value1 />
    <embed src=”wrapper.swf?para1=value1/>
                  </Object>
                 然后flex程序里通过 Application.application.parameters.para1获取参数值；
4）    ExternalInterface提供方法使Flex程序和外部的封装页面可以相互调用对方的方法，外部接口类要受到域安全性设置（allowScriptAccess, allowNetworking）的约束。
先判断ExternalInterface是否可用：
ExternalInterface.available;
flex调用js：
ExternalInterface.call(funName, funPara1, …, funParaN)；
js调用flex：
首先flex里面用ExternalInterface.addCallback(“jsFunName”,asFun),将AS里面定义的函数赋予一个js里面调用的函数的名字jsFunName；
然后在js里面用mySwf.jsFunName()调用flex里面提供的函数asFun；
ExternalInterface安全性：
一般来说js和flex的访问局限于同一个域之内。
可以设置<Object>和<Embed>的allowScriptAccess=”value”(value取值:never, always, sameDomain默认)来设置flex访问js的权限。
至于js对于flex方法的访问只有flex里面通过addCallback的js才可以访问，对于跨域，可以试用allowDomain()函数设置。
5）    navigateToURL() 可以用来打开一个新的浏览器窗口，也可以用来flex和js之间的通信。比如:
         打开一个新窗口：
var url:URLRequest = new URLRequest(http://blog.csdn.net);
navigateToURL(url, _blank);
这个函数也可以用来执行js，例如：
var url:URLRequest = new URLRequest(“javascript:window.close()”); 或者：
var urlLURLRequest = new URLRequest(“javascript:myFun(para1…paran)”)
myFun()函数是html页面的script部分定义的，函数参数一定要有引号！
navigateToURL(url, _self);
也可以用来发送email：
var urlURLRequest = new URLRequest(mailto:[e-mail]);
navigateToURL(url, _blank);