外界与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的内容。所以在实际应用中，需要对一些操作做回收，这个需要自己扩展。