仿WindowsXP画图板设计(1)

一.功能介绍
1.绘图功能：可以绘制直线，矩形，圆角矩形，椭圆
2.颜色设置功能：可以设置画布的背景色以及所绘制图形的颜色
3.文字输入和画笔功能：可以使用画笔绘制任意形状的曲线以及通过文字输入框在画板中加入简单的文字

下面是画图板的界面效果图
[img]http://dl.iteye.com/upload/picture/pic/94598/ad2d01a0-c32c-36a9-83e6-0bfde033c74b.png[/img]

下面展示路绘制出来的直线，(实心)矩形，(实心)椭圆，(实心)圆角矩形和用画笔随意勾画的曲线
[img]http://mytream.iteye.com/upload/picture/pic/94594/970ee6b8-2b2b-354c-8727-78b8e499ddfa.png[/img]

通过对话框输入文字
[img]http://mytream.iteye.com/upload/picture/pic/94592/c8479dfc-1e11-3598-9f7c-d0ce99b4a07f.png[/img]

通过颜色选择按钮改变背景色
[img]http://mytream.iteye.com/upload/picture/pic/94596/add03b15-8d9d-3bc0-983a-5d1e4ad01948.png[/img]


二.技术分析

画图板设计过程设计到了swing组件的布局管理，组件事件监听器的添加，已绘制图形的保存，组件对美化和标题栏的设置等

1.画图板界面分为三个部分：画布区域，颜色选择区域和图形选择区域。
这三个区域的组件被分别添加三个JPane对象中。主界面采用边界布局BorderLayout，画布区居中(CENTER),图形选择区在左侧(WEST)，颜色选择区处在下方(SOUTH)。
图形选择区中有18个组件，采用到是表格布局GridLayout，将单选按钮和图像标签放置在8行2列队表格面板中(JPanel)

2.对画板中的画布添加了鼠标监听器(MouseListener)和鼠标移动监听器(MouseMotionListener)，颜色选择按钮添加了动作监听器(ActionListener),菜单栏中的"退出"和"关于"菜单选项添加了动作监听器
ActionListener从系统提供的颜色选择板上获得画布上下文(graphics context)的颜色
MouseListener获取鼠标在画布上按下和释放时的位置，并在绘图区上绘制所选图形

3.由于正在执行的代码是处在系统的缓冲区中，所以在绘图区上绘制的图形如果不及时保存，就会因为界面的刷新(如最小化，移出显示屏等)而丢失掉。解决的方法是每次在绘制完一个图形后，立刻将其保存到一个容器类对象中(笔者使用的是ArrayList)，并重写绘图面板(DrawPane对象)刷新的方法，添加从容器队列中取出图形进行绘制的代码

4.为JPanel对象设置边框(Border)之后可使各个区域之间层次感更强。图形选择按钮之后的提示标签由文字换成ImageIcon对象使得用户界面看起来更加友好

5.标题栏的设置较为简单。还需要注意的是，在获得图形图片的URL地址时要准确放置图片的位置并在代码中写清相对位置

下面是程序的代码框架，具体可在附件中下载：
[img]http://mytream.iteye.com/upload/picture/pic/94558/6309698d-ffb8-3983-9d40-f657b1413829.png[/img]

三.问题总结

1.在取得绘图区的画布(graphics context图形上下文)时，必须是在主界面执行了setVisible(true)之后，因为这时才会生成画布，否则引用绘图区的画布进行操作时会抛出空指针异常。

2.绘图区仅仅是指绘图面板(DrawPanel 继承于 JPanel)，所以系统调用的自动刷新的函数是要在DrawPanel类中重写。否则若在JFame界面中重写，刷新后会导致图形覆盖其他区域。

3.最后也是最主要的一点是，开发过程应是以螺旋渐进的方式进行。我在刚开始设计画图板的时候把目标定的很大，恨不得实现WindowsXP附件中画图板板的每一个功能，结果导致多个版本由于技术上的限制不得不中途而废。所以在已完成的功能上运用新的技术才是最为有效的方法。