Flexpaper开发电子档案实践

最新推荐文章于 2019-08-12 21:19:43 发布
最新推荐文章于 2019-08-12 21:19:43 发布
阅读量880 收藏 1
点赞数
文章标签： Java Flex swfTools
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wuwenjun0207/article/details/9197259
版权

    鉴于网上已经有很多的仿百度文库开发的Java+FlexPaper+swfTools开发教程，对于一个初学者我提供一些我看过的写的不错的参考资料。希望能够帮助大家尽快的实现开发。

    首先说一下Flash Player（简称FP）。经常上网的朋友一定遇到过Flash Player版本升级的提示吧，这东西其实就是浏览器插件，据说已经有了98%的安装普及率（FP具体介绍请见http://baike.baidu.com/view/1585492.htm）。Flex生成的页面主要是通过Html包装一下生成的swf文件，和Flash生成的swf一样，它也靠FP才能完美运行，这有点类似JVM虚拟机和.NET FRAMEWORK（FP里内嵌了AVM虚拟机）。

    说了关于Flash的事情，其实是因为Flash比Flex更出名，ADOBE也察觉到这一点，所以在预备推出FLEX4时，又将其更名为Flash，只是SDK仍然沿用FLEX的名号。FLEX和FLASH并没有本质区别，它们最终都是转为ActionScript源文件，然后被编译为二进制的swf文件（就和JAVA文件被编译成class一样），再交由FP（FP就像JVM虚拟机一样）来执行。不同的是，FLASH更偏向于设计人员，它有时间轴和帧的概念，能更好地实现动画、特效、短片等美工效果。Flex是面向开发者的，隐藏了时间轴的概念（只有两帧），更专注于解决企业应用的表现层方案，提供了大量的通用组件用于构建前端页面、通过数据服务技术能更好的分离界面和逻辑业务层。


    通过这篇源码的说明http://blog.csdn.net/f111fei/article/details/9137279，我们可以自己去SVN上下载然后进行2次编译，开发自己所需的功能。只是这篇文章写得有点浅，可以说明一下各个文件的作用。

    其次我提供的是http://wenku.baidu.com/view/a23331d0b9f3f90f76c61b3d.html这篇文章。作者mark写的对于想要二次开发的人员很有帮助，它主要介绍了SWFTools的用法，Flash Builder的建立Flex项目以及具体参数的说明。但是具体像界面的工具栏操作的增加功能以及界面优化没有提出任何建议。

    再次我觉得http://blog.csdn.net/hil2000/article/details/8459940这篇文章从项目的经验着手，很好的为我们演示了Java+FlexPaper+swfTools的使用。但是只是从实验的角度讲了项目，具体应用不会只是打开一个图片或者pdf，我觉得目前这个模式主要可以应用在电子档案。

    

    

<%@ page import="nju.edu.software.zgy.bean.Dzda"%>
<%@ page import="nju.edu.software.zgy.bean.DzdaWj"%>
<%@ page import="nju.edu.software.zgy.bean.DzdaWjj"%>
<%@ page import="java.util.List"%>
<%@ page import="nju.edu.software.zgy.util.StringUtil"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<%@ page language="java" contentType="text/html; charset=GB2312" pageEncoding="utf-8"%>
<html xmlns="http://www.w3.org/1999/xhtml" >	
    <head> 
        <title>电子档案阅读</title>         
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
        <style type="text/css" media="screen"> 
			html, body	{ height:100%; }
			body { margin:0; padding:0; overflow:auto; text-align:center;}   
			#flashContent { display:none; }
			#ajxx {padding: 10px 5px 5px 5px;font-size:14px;font-weight: bold;text-align:center;margin-                        bottom:0px;color:#2E8B57;}	
			div.odd { background-color:#F0FFF0;padding:5px;margin-bottom:5px;}
			div.eve { background-color:#d8ecfb;padding:5px;margin-bottom:5px;}
			div.odd a{text-decoration: none;color:#2E8B57;}
			div.eve a{text-decoration: none;color:#2E8B57;}
			div.odd a:hover{color:#CD6839;}
			div.eve a:hover{color:#CD6839;}
		       .mulu_title{padding: 15px 5px 15px 5px;font-size:16px;font-weight:bold;text-align:center;mar                       gin-top:0px;background-color:#21748f;color:white;background-image: url(images/bg_icon01.gif)                       ;background-repeat: no-repeat;}
		       .mulu_content{height:92%;padding: 5px 5px 5px 5px;font-weight: bold;font-size:14px;text-alig                       n:left;margin-bottom:10px;line-height:150%;overflow-y:scroll;}
       
	   </style> 
		<link rel="stylesheet" href="css/themes/base/jquery.ui.all.css">
		<script src="Scripts/jquery-1.5.1.js"></script>
		<script src="Scripts/ui/jquery.ui.core.js"></script>
		<script src="Scripts/ui/jquery.ui.widget.js"></script>
		<script src="Scripts/ui/jquery.ui.tabs.js"></script>
		<script type="text/javascript" src="Scripts/flexpaper_flash_debug.js"></script>
		<script>

		$(function() {
				    <%
		    boolean zjExist,fjExist,gajExist,jcjExist;
		    int zjYm=0;
			int fjYm=0;
			int gajYm=0;
			int jcjYm=0;
		    String firstDajz="";
		    int firstYm=0;
		    Dzda dzda=(Dzda)request.getAttribute("dzda");
		    int subjyid=dzda.getSubjyid();
		    List<DzdaWjj> wjjList=dzda.getZjWjjList();
		    if(wjjList.isEmpty())zjExist=false;else {zjExist=true;firstDajz="zj";firstYm=dzda.getZjTotalPag                    es();zjYm=firstYm;}
		    wjjList=dzda.getFjWjjList();
		    if(wjjList.isEmpty())fjExist=false;else {fjExist=true;if(firstDajz==""){firstDajz="fj";firstYm=                    dzda.getFjTotalPages();}fjYm=firstYm;}
		    wjjList=dzda.getGajWjjList();
		    if(wjjList.isEmpty())gajExist=false;else {gajExist=true;if(firstDajz==""){firstDajz="gaj";first                    Ym=dzda.getGajTotalPages();}gajYm=firstYm;}
		    wjjList=dzda.getJcjWjjList();
		    if(wjjList.isEmpty())jcjExist=false;else {jcjExist=true;if(firstDajz==""){firstDajz="jcj";first                    Ym=dzda.getJcjTotalPages();}jcjYm=firstYm;}
		    %>
			var subjyid="<%=subjyid%>";
			var firstDajz="<%=firstDajz%>";
			var firstYm="<%=firstYm%>"
                    var zjYm="<%=zjYm%>"
			var fjYm="<%=fjYm%>"
			var gajYm="<%=gajYm%>"
			var jcjYm="<%=jcjYm%>"
			var divA=document.getElementById("zjml");
			var divB=document.getElementById("fjml");
			var divC=document.getElementById("gaml");
			var divD=document.getElementById("jcml");
			
			//设置缺省打开的目录和卷宗
			var defaultJz="{/dzda2/"+subjyid+"/"+firstDajz+"[*,0].swf,"+firstYm+"}";
			var defaultMulu=document.getElementById(firstDajz+"ml");
			defaultMulu.style.display="block";
			var fp = new FlexPaperViewer(	
						 'FlexPaperViewer',
						 'viewerPlaceHolder', { config : {
						// SwfFile : escape('/dzda2/Paper.swf'),
						SwfFile : escape(defaultJz),
						 Scale : 0.6, 
						 ZoomTransition : 'easeOut',
						 ZoomTime : 0.5,
						 ZoomInterval : 0.2,
						 FitPageOnLoad : true,
						 FitWidthOnLoad : false,
						 FullScreenAsMaxWindow : false,
						 ProgressiveLoading : false,
						 MinZoomSize : 0.2,
						 MaxZoomSize : 5,
						 SearchMatchAll : false,
						 InitViewMode : 'Portrait',
						 PrintPaperAsBitmap : false,
						 
						 ViewModeToolsVisible : true,
						 ZoomToolsVisible : true,
						 NavToolsVisible : true,
						 CursorToolsVisible : true,
						 SearchToolsVisible : true,
  						 localeChain: 'zh_CN'
						 }});
						 
			var viewer=window.FlexPaperViewer_Instance.getApi();
			$( "#tabs" ).tabs(
			{
				select: function(event, ui) { 
					divA.style.display="none";
					divB.style.display="none";
					divC.style.display="none";
					divD.style.display="none";
					
					switch(ui.index){
					case 0:
						divA.style.display="block";
						viewer.loadSwf("{/dzda2/"+subjyid+"/zj[*,0].swf,"+zjYm+"}");
						break;
					case 1:
						divB.style.display="block";
						viewer.loadSwf("{/dzda2/"+subjyid+"/fj[*,0].swf,"+fjYm+"}");
						break;
					default:
						break;
					} 
				}
			}
			);
			
			function getViewer(){
				return viewer;
			}
		});
		
		function getViewer(){
			var viewer=window.FlexPaperViewer_Instance.getApi();
			return viewer;
		}
		function show(){
			var img=document.getElementById("icon");
			if($("#ajxx").css("display") == "block"){
				$("#ajxx").css("display","none");
				$("#info").css("height","8%");
				$("#ml").css("height","92%");
				img.src="images/show.png";
			}
			else{
				$("#ajxx").css("display","block");
				$("#info").css("height","15%");
				$("#ml").css("height","85%");
				img.src="images/hide.png";
			}
		}
		
		</script>
		
    </head> 
    <body> 

	<div style="margin:0 auto;width:90%;padding-top:5px;height:95%;verflow-y:hidden;">
    	<!--<div style="position:absolute;left:110px;top:10px;">-->
		<div style="float:left;width:70%;height:100%;padding:0px;">
		<div id="tabs" style="width:100%;height:100%;">
		<ul> 
			<%if(zjExist){%><li><%}else{%><li style="display:none;"><%}%><a href="#tabs-1">正卷</a></li>
			<%if(fjExist){%><li><%}else{%><li style="display:none;"><%}%><a href="#tabs-1">副卷</a></li>
		</ul>
		<div id="tabs-1" style="width:100%;padding:0px;height:95%;overflow-x:hidden">
			<a id="viewerPlaceHolder" style="width:100%;height:100%;display:block"></a>
	        
		</div>
		</div>
        </div>
		<div style="float:right;width:27%;height:100%;font-family:Verdana;font-size:9pt;padding:0px;border-                style:solid;border-color:#CACACA;">
			<div id="info" style="height:15%;">
			    <div class="mulu_title" ><img id="icon" src="images/hide.png" style="display:none" oncl                        ick="show()">案号</div>
			    <div id="ajxx" >
			    <%=dzda.getAh()%></div>
			</div>
			<div id="ml" style="height:85%;padding-top:2px;">
			 <div id="zjml" style="display:none;height:100%;">
				<div class='mulu_title'>正卷目录</div>
				<div class='mulu_content'>
			    <%if(zjExist){
			     wjjList=dzda.getZjWjjList();
			     for(int i=0;i<wjjList.size();i++){
			         DzdaWjj dzdaWjj=wjjList.get(i);
			         String wjjmc=dzdaWjj.getWjjmc();
			         int startPage=dzdaWjj.getStartPage();
			         if(i%2==1){%>				   
						<div class="odd"><%}else{%>
						<div class="eve"><%} %>
						<img src="images/folder.png" />
						<a href="#" οnclick="getViewer().gotoPage(<%=startPage %>)"> （第<%                              =startPage%>页）<%=StringUtil.RemoveBracket(wjjmc) %>
						</a></div><%}}%>
			    </div>
			</div>
			<div id="fjml" style="display:none;height:100%;">
				<div class='mulu_title'>副卷目录</div>
				<div class='mulu_content'>
			    <%if(fjExist){
			     wjjList=dzda.getFjWjjList();
			     for(int i=0;i<wjjList.size();i++){
			         DzdaWjj dzdaWjj=wjjList.get(i);
			         String wjjmc=dzdaWjj.getWjjmc();
			         int startPage=dzdaWjj.getStartPage();
					 int endpage=startPage+dzdaWjj.getWjList().size();
			         if(i%2==1){%>				   
						<div class="odd"><%}else{%>
						<div class="eve"><%} %>
						<img src="images/folder.png" />
						<a href="#" οnclick="getViewer().gotoPage(<%=startPage %>)">（第<%=                              startPage%>页）<%=StringUtil.RemoveBracket(wjjmc) %>
						</a></div><%}}%>
			    </div>
			</div>
		    </div>
		</div>
	</div>
   </body> 
</html>
 

    目前写得jsp这个界面结合了文件结构,树结构以及阅读的FlexPaper页面。主要遇到的问题是界面diy方式不足，比如工具栏图标的鼠标响应文字可以变得更醒目。希望FlexPaper能够在接下来的第三版可以支持更好的实际结合。




小吴俊俊
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
flexpaper二次开发版本
04-10
1.去除右上角fp字样 2.去除右下角logo 3.去除工具栏打印按钮 4.去除工具栏文字选择按钮(等价于文档内容不可复制) 5.去除右键菜单的打印、全选、复制等选项 6.增加鼠标悬浮按钮显示中文提示
使用FlexPaper加载swf出现无法加载的问题
u010249858的博客
06-05 842
[size=medium]安装“swftools-2013-04-09-1007.exe”，该文件为PDF TO SWT。 当我们想要FlexPaper加载我们自己的swf时，发现一直处于等待状态，无法显示，检查swf的路径也没错，但就是一直无法加载。这种情况，很有可能就是.swf文件的版本问题啦。我们运行SWFTools的图形工具（gpdf2swf.exe）把pdf转换为swf，但是转换后的s...
FlexPaper查看.swf文件的使用方法
六六的小帅的博客
08-12 1054
1、首先需要下载FlexPaper_1.4.5_flash.zip工具包，这里不展示怎样在官网上面下载最新版本，因为我下载完成后不能使用。下面是这个工具包在我百度云上面的地址，可以直接下载， 链接：https://pan.baidu.com/s/10gdMOa9DXTCLsAoqm02F0Q 提取码：45u0 2、然后可以使用工具包中提供的.swf文件，也可以结合SWFTools工具转换一个...
Flexpaper二次开发入门教程
05-19
Flexpaper二次开发入门教程
ASP网上拍卖系统设计与实现(论文+源代码+开题报告).rar
08-10
资源包主要包含以下内容： ASP项目源码：每个资源包中都包含完整的ASP项目源码，这些源码采用了经典的ASP技术开发，结构清晰、注释详细，帮助用户轻松理解整个项目的逻辑和实现方式。通过这些源码，用户可以学习到ASP的基本语法、服务器端脚本编写方法、数据库操作、用户权限管理等关键技术。 数据库设计文件：为了方便用户更好地理解系统的后台逻辑，每个项目中都附带了完整的数据库设计文件。这些文件通常包括数据库结构图、数据表设计文档，以及示例数据SQL脚本。用户可以通过这些文件快速搭建项目所需的数据库环境，并了解各个数据表之间的关系和作用。 详细的开发文档：每个资源包都附有详细的开发文档，文档内容包括项目背景介绍、功能模块说明、系统流程图、用户界面设计以及关键代码解析等。这些文档为用户提供了深入的学习材料，使得即便是从零开始的开发者也能逐步掌握项目开发的全过程。 项目演示与使用指南：为帮助用户更好地理解和使用这些ASP项目，每个资源包中都包含项目的演示文件和使用指南。演示文件通常以视频或图文形式展示项目的主要功能和操作流程，使用指南则详细说明了如何配置开发环境、部署项目以及常见问题的解决方法。 毕业设计参考：对于正在准备毕业设计的学生来说，这些资源包是绝佳的参考材料。每个项目不仅功能完善、结构清晰，还符合常见的毕业设计要求和标准。通过这些项目，学生可以学习到如何从零开始构建一个完整的Web系统，并积累丰富的项目经验。
基于Android远程监控工具设计与实现.docx
最新发布
08-10
基于Android远程监控工具设计与实现.docx
C#网络办公助理设计与实现(源代码+论文).rar
08-10
资源包主要包含以下内容： ASP项目源码：每个资源包中都包含完整的ASP项目源码，这些源码采用了经典的ASP技术开发，结构清晰、注释详细，帮助用户轻松理解整个项目的逻辑和实现方式。通过这些源码，用户可以学习到ASP的基本语法、服务器端脚本编写方法、数据库操作、用户权限管理等关键技术。 数据库设计文件：为了方便用户更好地理解系统的后台逻辑，每个项目中都附带了完整的数据库设计文件。这些文件通常包括数据库结构图、数据表设计文档，以及示例数据SQL脚本。用户可以通过这些文件快速搭建项目所需的数据库环境，并了解各个数据表之间的关系和作用。 详细的开发文档：每个资源包都附有详细的开发文档，文档内容包括项目背景介绍、功能模块说明、系统流程图、用户界面设计以及关键代码解析等。这些文档为用户提供了深入的学习材料，使得即便是从零开始的开发者也能逐步掌握项目开发的全过程。 项目演示与使用指南：为帮助用户更好地理解和使用这些ASP项目，每个资源包中都包含项目的演示文件和使用指南。演示文件通常以视频或图文形式展示项目的主要功能和操作流程，使用指南则详细说明了如何配置开发环境、部署项目以及常见问题的解决方法。 毕业设计参考：对于正在准备毕业设计的学生来说，这些资源包是绝佳的参考材料。每个项目不仅功能完善、结构清晰，还符合常见的毕业设计要求和标准。通过这些项目，学生可以学习到如何从零开始构建一个完整的Web系统，并积累丰富的项目经验。
[毕业设计]VB环境下身份证信息管理系统的设计与实现(源代码+论文).zip
08-10
[毕业设计]VB环境下身份证信息管理系统的设计与实现(源代码+论文)
node.js安装与配置以及clone代码.md
08-10
node.js安装与配置以及clone代码.md
华为FusionSphere-3.0-基础架构虚拟化解决方案
08-10
华为FusionSphere_3.0_基础架构虚拟化解决方案介绍，PPT格式
基于C#人事管理系统(源代码+论文+答辩PPT).rar
08-10
资源包主要包含以下内容： ASP项目源码：每个资源包中都包含完整的ASP项目源码，这些源码采用了经典的ASP技术开发，结构清晰、注释详细，帮助用户轻松理解整个项目的逻辑和实现方式。通过这些源码，用户可以学习到ASP的基本语法、服务器端脚本编写方法、数据库操作、用户权限管理等关键技术。 数据库设计文件：为了方便用户更好地理解系统的后台逻辑，每个项目中都附带了完整的数据库设计文件。这些文件通常包括数据库结构图、数据表设计文档，以及示例数据SQL脚本。用户可以通过这些文件快速搭建项目所需的数据库环境，并了解各个数据表之间的关系和作用。 详细的开发文档：每个资源包都附有详细的开发文档，文档内容包括项目背景介绍、功能模块说明、系统流程图、用户界面设计以及关键代码解析等。这些文档为用户提供了深入的学习材料，使得即便是从零开始的开发者也能逐步掌握项目开发的全过程。 项目演示与使用指南：为帮助用户更好地理解和使用这些ASP项目，每个资源包中都包含项目的演示文件和使用指南。演示文件通常以视频或图文形式展示项目的主要功能和操作流程，使用指南则详细说明了如何配置开发环境、部署项目以及常见问题的解决方法。 毕业设计参考：对于正在准备毕业设计的学生来说，这些资源包是绝佳的参考材料。每个项目不仅功能完善、结构清晰，还符合常见的毕业设计要求和标准。通过这些项目，学生可以学习到如何从零开始构建一个完整的Web系统，并积累丰富的项目经验。
java基于ssm+vue葛溪乡留守儿童信息管理系统源码 带毕业论文
08-10
【资源说明】 1、开发环境：ssm框架；内含Mysql数据库；VUE技术 2、该资源包括项目的全部源码，下载可以直接使用！ 3、本项目适合作为计算机、数学、电子信息等专业的课程设计、期末大作业和毕设项目，作为参考资料学习借鉴。 4、本资源作为“参考资料”如果需要实现其他功能，需要能看懂代码，并且热爱钻研，自行调试。
教你怎么配置nginx
08-10
配置文件
简历-求职简历-word-文件-简历模版免费分享-应届生-高颜值简历模版-个人简历模版-简约大气-大学生在校生-求职-实习
08-10
七夕情人节表白代码简历-求职简历-word-文件-简历模版免费分享-应届生-高颜值简历模版-个人简历模版-简约大气-大学生在校生-求职-实习 简历是展示个人经历、技能和能力的重要文档，以下是一个常见的简历格式和内容模板，供您参考： 简历格式： 头部信息：包括姓名、联系方式（电话号码、电子邮件等）、地址等个人基本信息。 求职目标（可选）：简短描述您的求职意向和目标。 教育背景：列出您的教育经历，包括学校名称、所学专业、就读时间等。 工作经验：按时间顺序列出您的工作经历，包括公司名称、职位、工作时间、工作职责和成就等。 技能和能力：列出您的专业技能、语言能力、计算机技能等与职位相关的能力。 实习经验/项目经验（可选）：如果您有相关实习或项目经验，可以列出相关信息。 获奖和荣誉（可选）：列出您在学术、工作或其他领域获得的奖项和荣誉。 自我评价（可选）：简要描述您的个人特点、能力和职业目标。 兴趣爱好（可选）：列出您的兴趣爱好，展示您的多样性和个人素质。 参考人（可选）：如果您有可提供推荐的人员，可以在简历中提供其联系信息。 简历内容模板： 姓名: 联系方式: 地址: 求职目标: （
java基于ssm+vue 学生学情预警系统源码 带毕业论文
08-10
【资源说明】 1、开发环境：ssm框架；内含Mysql数据库；VUE技术 2、该资源包括项目的全部源码，下载可以直接使用！ 3、本项目适合作为计算机、数学、电子信息等专业的课程设计、期末大作业和毕设项目，作为参考资料学习借鉴。 4、本资源作为“参考资料”如果需要实现其他功能，需要能看懂代码，并且热爱钻研，自行调试。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值