为了在Flex页面中嵌入Html页面以显示报表,百度了一下,找到一个方法,可以在Flex页面中嵌入IFrame,这个IFrame可以有一个source,这个源就是一个Html页面。
详细步骤:
1、Flex项目中导入flex-iframe(-1.5.1).swc
2、新建一个Flex页面,此处有个现成的例子,百度来的
如下:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns="*"
xmlns:ns="http://code.google.com/p/flex-iframe/"
creationComplete="iFrame.visible=true" viewSourceURL="srcview/index.html">
<mx:HBox width="100%" height="100%">
<mx:Panel width="200" height="100%" title="Tree">
<mx:Tree id="tree" width="100%" height="100%"
change="iFrame.source = (Tree(event.target).selectedItem.attribute('path').toString());"
dataProvider="{treeData}" labelField="@label" showRoot="false"/>
</mx:Panel>
<mx:Panel width="100%" height="100%" paddingBottom="1" paddingLeft="1" paddingRight="1"
paddingTop="1" title="Content">
<ns:IFrame id="iFrame" width="100%" height="100%"
source="http://www.adobe.com/devnet/flex/"/>
<mx:ControlBar>
<mx:CheckBox id="cbVisible" label="IFrame Visible"
click="iFrame.visible=cbVisible.selected" selected="true"/>
</mx:ControlBar>
</mx:Panel>
</mx:HBox>
<mx:XMLList id="treeData">
<node label="Flex Resources">
<node label="Flex Developer Center" path="http://www.adobe.com/devnet/flex/"/>
<node label="Flex Team Blog" path="http://weblogs.macromedia.com/flexteam/"/>
<node label="Flex Blogs on MXNA"
path="http://weblogs.macromedia.com/mxna/FeedList.cfm#Flex"/>
<!-- these sites pop themselves out of a frame:
<node label="flex.org" path="http://www.flex.org" />
<node label="Adobe Labs" path="http://labs.adobe.com/wiki/index.php/Main_Page" />
-->
</node>
<node label="Search">
<node label="Google" path="http://www.google.com"/>
<node label="Yahoo" path="http://www.yahoo.com"/>
</node>
</mx:XMLList>
</mx:Application>
重点内容是<ns:IFrame id="iFrame" width="100%" height="100%" source="http://www.adobe.com/devnet/flex/"/>
其中的source属性可以链接一个Html页面,将自己的Html页面地址放在这里就OK了。
PS:IFrame有个处于页面顶层的特点,当弹出对话框或控件的时候,重叠部分就会被IFrame盖住,建议在弹出对话框或控件的时候先把IFrame隐藏,关闭后再显示。