Java在线打开word文档实现手写批注

版权声明:本文为博主原创文章,如果喜欢欢迎收藏转载! https://blog.csdn.net/IT_zhang81/article/details/88344702

前言:

有些OA系统会有用户在线对word文档添加手写批注的需求,这样的需求看似不好实现,其实是可以实现的。

但是这需要开发者具备将activex控件集成到Java环境的能力。对于大部分Java开发工程师来说,仅仅解决单一的功能就要掌握activex控件,未免学习成本太大。

所以我们今天就要介绍一个中间件技术——pageoffice,此中间件技术已经将 在web系统操作office文档的大部分功能整合完毕,大家只需要关注自己web系统的业务逻辑即可,学习成本低,且功能很丰富。下面我们来实战用pageoffice实现一下用Java语言在线打开word文档的同时,向word文档中添加手写批注的功能。

先看效果:

可以看到,文档在页面中打开的效果和本地office打开的效果差不多,且手写批注的功能也轻松的实现了。

 部署步骤(只需4步)

1.官网http://www.zhuozhengsoft.com/dowm/下载集成文件,引入jar包,配置web.xml

去刚才下载的集成文件中找到lib,将里面的内容放在项目web-inf的lib中引入jar包,然后将web.xml的pageoffice配置引入到自己项目的wb.xml中

2.在父页面aaa.jsp(需要打开文档的页面)放一个a标签或者button

写a标签之前先引入pageoffice需要的js文件

<script type="text/javascript" src="/jquery.min.js"></script>
<script type="text/javascript" src="/pageoffice.js" id="po_js_main"></script>

然后添加a标签 

<a href="javascript:POBrowser.openWindowModeless('Word.jsp' , 'width=1200px;height=800px;');">手写批注接口演示</a>

3.在父页面同级目录下创建一个名为Word.jsp的文件

<%@ page language="java"
	import="java.util.*,com.zhuozhengsoft.pageoffice.*"
	pageEncoding="utf-8"%>
<%
	//******************************卓正PageOffice组件的使用*******************************
	PageOfficeCtrl poCtrl1 = new PageOfficeCtrl(request);
	poCtrl1.setServerPage(request.getContextPath()+"/poserver.zz"); //此行必须
	//隐藏菜单栏
	poCtrl1.setMenubar(false);
	//添加自定义按钮
	
	poCtrl1.addCustomToolButton("开始手写", "StartHandDraw()", 5);
	poCtrl1.addCustomToolButton("设置线宽", "SetPenWidth()", 5);
	poCtrl1.addCustomToolButton("设置颜色", "SetPenColor()", 5);
	poCtrl1.addCustomToolButton("设置笔型", "SetPenType()", 5);
	poCtrl1.addCustomToolButton("设置缩放", "SetPenZoom()", 5);
	poCtrl1.addCustomToolButton("访问手写集", "GetHandDrawList()", 6);

	
	poCtrl1.webOpen("test.doc", OpenModeType.docNormalEdit, "张三");
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title></title>

		<script language="JavaScript">
		
        //开始手写
        function StartHandDraw() {
            document.getElementById("PageOfficeCtrl1").HandDraw.Start();
        }
        //设置线宽
        function SetPenWidth() {
            document.getElementById("PageOfficeCtrl1").HandDraw.SetPenWidth(5);
        }
        //设置颜色
        function SetPenColor() {

            document.getElementById("PageOfficeCtrl1").HandDraw.SetPenColor(5292104);
        }
        //设置笔型
        function SetPenType() {

            document.getElementById("PageOfficeCtrl1").HandDraw.SetPenType(1);
        }
        //设置缩放
        function SetPenZoom() {

            document.getElementById("PageOfficeCtrl1").HandDraw.SetPenZoom(50);
        }
        //撤销最近一次手写
        function UndoHandDraw() {

            document.getElementById("PageOfficeCtrl1").HandDraw.Undo();
        }
        //退出手写
        function ExitHandDraw() {

            document.getElementById("PageOfficeCtrl1").HandDraw.Exit();
        }
        //访问手写集合
        function GetHandDrawList() {

            var handDrawList = null;
            var handDraw = null;
            handDrawList = document.getElementById("PageOfficeCtrl1").HandDraw;
            handDrawList.Refresh();
            document.getElementById("PageOfficeCtrl1").Alert("本文档共有 " + handDrawList.Count + " 个手写批示。");
            var i = 0; //索引从0开始
            for (i = 0; i < handDrawList.Count; i++) {
                handDraw = handDrawList.Item(i);
                handDraw.Locate();
                document.getElementById("PageOfficeCtrl1").Alert("第" + handDraw.PageNumber + "页" + ", " + handDraw.UserName + ", " + handDraw.DateTime);
            }
        }
        
    </script>

	</head>
	<body>
		<div
			style="font-size: 12px; line-height: 20px; border-bottom: dotted 1px #ccc; border-top: dotted 1px #ccc; padding: 5px;">
			<span style="color: red;">操作说明:</span>若想提前设置线宽、颜色、笔型、缩放等,可先点击自定义工具栏上的相应按钮,然后点击“开始手写”按钮。在尚未关闭手写工具栏时,点“撤销最近一次手写”按钮,可撤销最近一次的手写;点击“退出手写”按钮,可退出手写;还可点“设置线宽”、“设置颜色”等按钮对手写批注的颜色、线宽等进行再次设置。
			<br />
			关键代码:点右键,选择“查看源文件”,看js函数
			<br />
			<input id="Button3" type="button" value="设置线宽"
				onclick="SetPenWidth()" />
			<input id="Button4" type="button" onclick="SetPenColor()"
				value="设置颜色" />
			<input id="Button1" type="button" value="撤销最近一次手写"
				onclick="UndoHandDraw()" />
			<input id="Button2" type="button" onclick="ExitHandDraw()"
				value="退出手写" />
			<span style="background-color: Yellow;"></span>
		</div>
		<br />
		<form id="form1">
			<div style="height: 700px; width: auto;">
				        <%=poCtrl1.getHtmlCode("PageOfficeCtrl1")%>
			</div>
		</form>
	</body>
</html>

4.新建文件

新建一个名为test.doc的word文件(如果新建的是docx文件就将第三步的poCtrl1.webOpen("test.doc", OpenModeType.docNormalEdit, "张三");代码改为poCtrl1.webOpen("test.docx", OpenModeType.docNormalEdit, "张三");

将新建的test.doc文件放在Word.jsp同级目录下。

本地打开test.doc文件,随意编辑一些内容,保存.

然后启动项目直接访问aaa.jsp点击链接.此时会提示安装插件,点击安装成功后提示注册,填写相关信息,填写注册码Q37LN-W8NI-KFSQ-LEY3Y就可以打开文档.

注意:此示例只演示了手写批注,没有实现保存功能.如果需要更丰富的功能,可以去pageoffice官网下载示例代码直接将samples4文件夹拷贝到Tomcat的webapps下,启动Tomcat,浏览器访问http://localhost:8080/Samples4/index.html,查看示例中的下面一个链接,直接看samples4文件夹下WordHandDraw文件夹里面的代码.

刚开始接触pageoffice的话,也可以看视频快速上手http://www.zhuozhengsoft.com/Technical/

如有侵权,请联系博主

猜你喜欢

转载自blog.csdn.net/IT_zhang81/article/details/88344702
今日推荐