我们知道对于原始的FlexPaper来说,如果打开带有中文的url路径的swf文件时,原始的FlexPaper无法显示带中文路径的swf文件!针对网友提出的问题我提供两种解决方案:
特别注意:需要设置Web服务器的URL编码,如果Web服务器是Tomcat需要设置如下配置,在server.xml下配置:
<Connector port="8080" protocol="HTTP/1.1" connectionTimeout="20000" redirectPort="8443" URIEncoding="UTF-8" />
方案一:当我们需要通过FlexPaper来打开swf文件时,实现类似百度在线阅读文档功能需求!我们可以在我们应用中尽量避免出现中文路径的swf文件路径,如避免出现像这样的文件路径:
如果所示,对于原始的FlexPaper来说,我们要打开这样路径下的swf文件时候,原始的FlexPaper无法正常显示swf文件,会出现一直在打转的情况!为了在项目需要,打开对应的swf文件的话,可以尽量将swf的文件名转化成英文或者数字的文件名!当然这不是最完美的解决方案!这种解决方案在项目开发过程中被称为规避法则!
当然,我还有最佳的解决方案,那就是对原始的FlexPaper进行二次开发来解决以上存在的问题!言归正传,下面开始讲方案:
方案二:
1、下载Flex集成开发工具Adobe Flash Builder v4.5
2、下载原始的FlexPaper的源码,网上有链接,自己下载!
3、在开发工具里新建Flex项目,和java项目的创建方式类似,见下图:
生成如下结构:
4、将下载的原始的FlexPaper源码解压,见下图:
拷贝其中的locale、src、assets三个文件夹到新建的Flex下,如图所示:
5、修改项目属性,点击项目的属性,将附加的编译参数修改成如下所示,-locale zh_CN -source-path=locale/{locale} -keep-all-type-selectors=true,其中这个编辑参数决定了Flex播放器是否支持播放中文的路径下的swf文件,这个步骤是关键,见下图:
6、在src下新建一个flexpaper.mxml文件,复制如下代码:
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns:fp="com.devaldi.controls.flexpaper.*" layout="absolute" width="100%" height="100%" applicationComplete="initApp();"> <mx:Script> <![CDATA[ import mx.controls.Alert; public var _aid = 0;//文档ID [Bindable] public var _Scale:Number = 1;//缩放比例 [Bindable] public var _SwfFile:String = "";//SWF文件路径 [Bindable] public var _ZoomTransition:String = "easeOut"; [Bindable] public var _ZoomTime:Number = 0.6; [Bindable] public var _ZoomInterval:Number = 0.1; [Bindable] public var _FitPageOnLoad:Boolean = false;//加载后适合高度 [Bindable] public var _FitWidthOnLoad:Boolean = false;//加载后适合宽度 [Bindable] public var _PrintEnabled:Boolean = true;//是否支持打印 [Bindable] public var _FullScreenAsMaxWindow:Boolean = false;//是否支付全屏 [Bindable] public var _ProgressiveLoading:Boolean = false;//是否延迟加载 [Bindable] public var _localeChain:String = "zh_CN";//语言 private var isFocus:Boolean = false; //初始化参数 private function initApp():void{ var params:Object = Application.application.parameters; _Scale = getNumber(params, "Scale", 1); _SwfFile = getString(params, "SwfFile", "Paper.swf"); _ZoomTransition = getString(params, "ZoomTransition", "easeOut"); _ZoomTime = getNumber(params, "ZoomTime", 0.6); _ZoomInterval = getNumber(params, "ZoomInterval", 0.1); _FitPageOnLoad = getBoolean(params, "FitPageOnLoad", false); _FitWidthOnLoad = getBoolean(params, "FitWidthOnLoad", false); _PrintEnabled = getBoolean(params, "PrintEnabled", true); _FullScreenAsMaxWindow = getBoolean(params, "FullScreenAsMaxWindow", false); _ProgressiveLoading = getBoolean(params, "ProgressiveLoading", true); _localeChain = params["localeChain"]; //注册事件监听 this.addEventListener(MouseEvent.MOUSE_OVER, onMouseOver); this.addEventListener(MouseEvent.MOUSE_OUT, onMouseOut); //开放给外部(javascript)调用 ExternalInterface.addCallback("hasFocus", hasFocus); //ExternalInterface.addCallback("focus", focus); ExternalInterface.addCallback("setViewerFocus", setViewerFocus); ExternalInterface.addCallback("gotoPage", gotoPage); } private function onMouseOver(event:MouseEvent):void{ this.isFocus = true; } private function onMouseOut(event:MouseEvent):void{ this.isFocus = false; } public function hasFocus():Boolean{ //Alert.show("hasFocus"); return isFocus; } public function setViewerFocus(isFocus:Boolean):void{ //Alert.show("setViewerFocus"); this.paperViewer.setViewerFocus(); } /** * * 获取String类型参数 * 如果没有,则返回默认值 **/ private function getString(params:Object, name:String, def:String):String{ if(params[name] != null){ return params[name]; } return def; } private function getNumber(params:Object, name:String, def:Number):Number{ if(params[name] != null){ return params[name]; } return def; } private function getBoolean(params:Object, name:String, def:Boolean):Boolean{ //Alert.show("比较:"+name); if(params[name] != null){ return params[name] == "true"; } return def; } public function gotoPage(p:Number):void{ paperViewer.gotoPage(p); } ]]> </mx:Script> <fp:FlexPaperViewer id="paperViewer" width="100%" height="100%" Scale="{_Scale}" SwfFile="{_SwfFile}" ZoomTransition="{_ZoomTransition}" ZoomTime="{_ZoomTime}" ZoomInterval="{_ZoomInterval}" FitPageOnLoad="{_FitPageOnLoad}" FitWidthOnLoad="{_FitWidthOnLoad}" PrintEnabled="{_PrintEnabled}" FullScreenAsMaxWindow="{_FullScreenAsMaxWindow}" ProgressiveLoading="{_ProgressiveLoading}" /> </mx:Application>
7、重新构建整个Flex项目,在集成开发工具的工作空间找到编译生成Flex播放器的swf文件,如下图:
将改为文件引用到项目中即可!
这样就可以解决FlexPaper无法播放带中文路径的swf文件了!
如下为显示效果图: