开发网页手写留痕系统(JSP篇)

　　B/S系统的手写留痕还是有一定的应用的，如办公系统中的签字、批示等。下面介绍如何实现页面上的手写留痕。

系统中用到jstl、hsql数据库以及一点简单的java绘图函数，如果对以上基础知识有所疑问，请自行解决（如不解决，也能成功）。

　　本文对于如何使用JSTL、HSQL以及jsp生成验证码等技术有一定的借鉴意义。

　　我发现在小型系统中使用HSQL真是绝配，就如同asp与mdb配合一样的和谐。


　　下面介绍一下手写留言系统的主要部分。完整的系统请到我的网络硬盘下载（http://wallimn.ys168.com）

1.首先是一个手写信息录入的界面，很简单，使用一个小插件就搞定了。这一部分不做过多介绍。



2.数据保存


　　使用上JSTL保存数据，很方便。使用一个jsp页面、一条JSTL语句就够了。当然web.xml中要配制一下

<context-param>
    <param-name>javax.servlet.jsp.jstl.sql.dataSource</param-name>
        <param-value>jdbc:hsqldb:file:d:/hsql/signdata,
      org.hsqldb.jdbcDriver,sa,</param-value>
</context-param>

保存数据的页面：

<%@ page language="java" pageEncoding="UTF-8" import="java.util.*"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core " prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql " prefix="sql" %>
<sql:update var="upres" sql="insert into SIGNTAB (usern,SIGNDATA,DT) values(?,?,NOW)">
 <sql:param>${param.usern}</sql:param>
 <sql:param>${param.signdata}</sql:param>
</sql:update>
<c:choose>
 <c:when test="${upres==1}">
  保存成功！系统正转向显示页面......
  <script type="text/javascript">
   window.location="signlist.jsp";
  </script>
 </c:when>
 <c:otherwise>
  保存失败!<a href="javascript:history.go(-1);">返回</a>
 </c:otherwise>
</c:choose> 

3.显示留言的页面

<%@ page language="java" contentType="image/jpeg" pageEncoding="UTF-8"
import="java.util.*,java.awt.image.*,java.util.*,javax.imageio.*,java.awt.*,java.awt.geom.*"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core " prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/sql " prefix="sql" %>
<sql:query var="results" sql="select * from SIGNTAB where ID=?">
 <sql:param>${param.id}</sql:param>
</sql:query>
<c:set value="${results.rows[0].signdata}" var="signdata" scope="page"></c:set>
<%
 String data = (String)pageContext.getAttribute("signdata");
 response.setHeader("Pragma", "No-cache");
 response.setHeader("Cache-Control", "no-cache");
 response.setDateHeader("Expires", 0);
 int width=400, height=300;
 BufferedImage image = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
 
 Graphics g = image.getGraphics();
 Graphics2D g2 = (Graphics2D)g;
 //Pen pen = new Pen();
 //g.drawLine();
 g.setColor(Color.WHITE);
 g.fillRect(0,0,width,height);
 g.setColor(Color.BLACK);
 Line2D line = new Line2D.Double(0,0,1,1);
 
    String[] strokes = data.split(";;");
    String[] tmp = null, detail;
    int x1, x2, y1, y2;
 //Color clr = null;
    for (int i = 0; i < strokes.length; i++)
    {
        if (strokes[i] == null) continue;
        tmp = strokes[i].split(";");
        if (tmp == null || tmp.length == 0) continue;
        detail = tmp[0].split(",");
        int clr = Integer.parseInt(detail[0],16);
//        pen.Color = Color.FromArgb((clr&0xff),(clr&0xff00)>>8,(clr&0xff0000)>>16);
  int wid = Integer.parseInt(detail[1], 16);
  g2.setColor(new Color((clr&0xff),(clr&0xff00)>>8,(clr&0xff0000)>>16));
  g2.setStroke(new BasicStroke(wid));
        x1 = Integer.parseInt(detail[2], 16);
        y1 = Integer.parseInt(detail[3], 16);
        for (int j = 1; j < tmp.length; j++)
        {
            detail = tmp[j].split(",");
            x2 = Integer.parseInt(detail[0], 16);
            y2 = Integer.parseInt(detail[1], 16);
   
   line.setLine(x1,y1,x2,y2);
            g2.draw(line);
            x1 = x2; y1 = y2;
        }
    }

 g.dispose();
 ImageIO.write(image, "JPEG", response.getOutputStream());
%>

　　以上只是粗略的介绍了一下，下载整个系统运行一下（http://wallimn.ys168.com
），可以很容易搞清楚。

　　对于喜欢使用asp.net的朋友，我还写了一个asp.net版的，也可以从我的网络硬盘下载到。
/***********本人原创，欢迎转载，转载请保留本人信息*************/
作者：wallimn　电邮：[e-mail]　时间：2009-02-28
博客：http://wallimn.iteye.com
　　　http://blog.csdn.net/wallimn
网络硬盘：http://wallimn.ys168.com
/***********文章发表请与本人联系，作者保留所有权利*************/