FlexPaper二次开发之解决中文路径无法显示问题

我们知道对于原始的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文件了!

如下为显示效果图:

评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值