FlexPaper源码的修改

1.搭建Flexbuilder环境，网上很多，不在赘述。(FlexPaper要求的是Flex4，因为Flex3有的代码不支持)。

2.通过http://flexpaper.googlecode.com/svn/trunk/这个地址，获取Flexpaper的源码（我下载的是2012-1-24日的版本）。在获取前，我们需要安装SVN，这里我们使用TortoiseSVN，安装后打开，选择file->TortoiseSVN->Repo-browser，输入上面的地址即可。(文件见附件，FlexPaper.rar 文件)。

3.新建一个Flex项目，将FlexPaper源码下的src目录和local目录覆盖到你新建的Flex项目的src目录，以及lib下的FlexPaper_Resources.swc文件拷贝到项目的libs目录下。如附件所示：项目结构.jpg。

4.在默认包下打开和你项目名称同名的一个mxml文件，加入如下代码：

<?xml version="1.0" encoding="utf-8"?>  
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
				xmlns:fp="com.devaldi.controls.flexpaper.*"
				width="100%" height="100%" applicationComplete="initApp();" layout="absolute"
				viewSourceURL="srcview/index.html">  
	
	<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 = true;//加载后适合高度  
			
			[Bindable]  
			public var _FitWidthOnLoad:Boolean = true;//加载后适合宽度  
			
			[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);      
			}  
			
			
			
			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;  
			}  
		]]>  
	</mx:Script>  
	<!--mx:Panel x="165" y="76" width="250" height="200" layout="absolute" title="一个人">  
	<mx:Label x="59" y="37" text="{Scale}" width="88"/>  
	</mx:Panel-->  
	
	<fp:FlexPaperViewer id="paperViewer" 
						width="100%"   
						height="100%"   
						Scale="{_Scale}"   
						SwfFile="{_SwfFile}"   
						ZoomTransition="{_ZoomTransition}"   
						ZoomTime="{_ZoomTime}"   
						ZoomInterval="{_ZoomInterval}" 
						FitPageOnLoad="{_FitPageOnLoad}" 
						FitWidthOnLoad="{_FitWidthOnLoad}" 
						FullScreenAsMaxWindow="{_FullScreenAsMaxWindow}" 
						ProgressiveLoading="{_ProgressiveLoading}" />  
</mx:Application>

5.去掉工具栏最右边[关于...]对话框的显示的按钮

源文件:FlexPaperViewer.mxml

将源码中查找所有的bttnInfo，共如下三处：

1)bttnInfo.visible = (new MenuIcons.SMALL_TRANSPARENT().width > 10);用"//"注释掉
2)bttnInfo.visible = (new MenuIcons.SMALL_TRANSPARENT().width > 10);用"//"注释掉
3)bttnInfo.visible = true;改为bttnInfo.visible = false;
//spin1.visible = true;注释掉
 spin1.visible = false;

6.去掉底部的logo图片：

源文件: FlexPaperViewer.mxml

将<fp:FlexPaperViewer_Base ...>的属性最后行加入creationComplete处理:

<fp:FlexPaperViewer_Base xmlns:mx="http://www.adobe.com/2006/mxml" 
                                                 addedToStage="bindStageEvents(event)" 
                                                 xmlns:fp="com.devaldi.controls.flexpaper.*" 
                                                 xmlns:ct="com.devaldi.controls.*" 
                                                 xmlns:st="com.devaldi.skinning.*"  
                                                 creationComplete="initApp()">

然后加入处理initApp()函数到<mx:Script>中

 public function initApp():void {         
                                paper1.removeElementAt(2); 
                        }

最后将源码中的函数papersLoadingHandler(event:Event)最后一行加上:paper1.removeElementAt(2);修改后如下所示：

protected override function papersLoadingHandler(event:Event):void{
				//spin1.start();
				//spin1.visible = true;
				spin1.visible = false;
				super.papersLoadingHandler(event);
				paper1.removeElementAt(2);
			}

7.菜单栏中文显示:

右键项目--->属性---->Flex编译器--->在附加的编译器参数框里加入下面一句：-locale zh_CN -source-path=locale/{locale} -keep-all-type-selectors=true即可。

8.点击菜单后，logo又出现的问题:

源文件: FlexPaperViewer.mxml修改如下代码：

<st:GradientImageButton icon="{MenuIcons.SINGLE_PAGE}" styleName="toolbttn" width="20" click="paper1.switchMode(Viewer.InitViewMode);paper1.removeElementAt(2);" toolTip="@Resource(key='SinglePage', bundle='FlexPaper')" selected="{paper1.ViewMode == Viewer.InitViewMode}" tabIndex="2" visible="{ViewModeToolsVisible}" includeInLayout="{ViewModeToolsVisible}"/>
		<st:GradientImageButton icon="{MenuIcons.TWO_PAGE}" styleName="toolbttn" width="20" click="paper1.switchMode('TwoPage');paper1.removeElementAt(2);" toolTip="@Resource(key='TwoPage', bundle='FlexPaper')" selected="{paper1.ViewMode == ViewModeEnum.TWOPAGE}"  tabIndex="3" visible="{ViewModeToolsVisible}" includeInLayout="{ViewModeToolsVisible}"/>
		<st:GradientImageButton icon="{MenuIcons.THUMBS}" styleName="toolbttn" width="20" click="paper1.switchMode('Tile');paper1.removeElementAt(2);" toolTip="@Resource(key='ThumbView', bundle='FlexPaper')" selected="{paper1.ViewMode == ViewModeEnum.TILE}" tabIndex="4" visible="{ViewModeToolsVisible}" includeInLayout="{ViewModeToolsVisible}"/>

protected override function onViewModeChanged(event:ViewModeChangedEvent):void{
				txtPage.text = formatPageNumber(viewer.currPage);
				super.onViewModeChanged(event);
				paper1.removeElementAt(2);
			}

到此源码就改好了。

FlexPaper源码的修改

猜你喜欢