使用Java Swing组件开发画板（2）

傷城~ 2024-03-31 08:50 70阅读 0赞

上期讲解了画板简单功能的实现，这一期要来讲解如何让画板画出其他图形

## **一、矩形类图形** ##

上一期讲解了直线的绘制是通过鼠标拖拽的监听器实现的，而绘制矩形也一样。此外，这个方法不仅适用于矩形，还适用于等腰三角以及椭圆等。

1、矩形：

矩形的绘制首先在mousePressed方法中获取按下鼠标按键的坐标，在mouseReleased中获取鼠标按键释放的坐标，并通过Graphic中的drawRect方法实现即可。

public void mousePressed(MouseEvent e) {
            x1 = e.getX();
            y1 = e.getY();
            //x1 , y1代表起始点坐标
        }
    
    
    public void mouseReleased(MouseEvent e) {
            x2 = e.getX();
            y2 = e.getY()；
            graphics02.drawRect(x1 , y1 , x2 - x1 , y2 - y1);
        }

但这种实现方法有一个问题就是只能从左上角托至右下角，因此为了让产生的图形对角线能够跟随鼠标，因此要对坐标进行转换 首先是宽和高。我们通过Java内置的数学模块解决，这里使用绝对值。此外，为了实现鼠标往任意方向拖动时，矩形对角线能够跟随，因此需要判断两个坐标的最小值

public void mouseReleased(MouseEvent e) {
            x2 = e.getX();
            y2 = e.getY();
            int rectWidth = Math.abs(x1 - x2);//矩形宽度绝对值
            int rectHeight = Math.abs(y1 - y2);//矩形高度绝对值
            //坐标最小值判断
            int minX = Math.min(x1 , x2);
            int minY = Math.min(y1 , y2);
            graphics02.drawRect(minX , minY , rectWidth , rectHeight);
        }

同时这个方法也适用于椭圆（drawOval）的绘制

2、等腰三角

等腰三角的绘制也是需要直到宽和高。由于等腰三角没有特定的绘制方法，因此这里我们可以看作绘制三条直线。通过计算等腰三角的三个顶点，并通过直线方法绘制出来即可

graphics02.drawLine(x2 , y2 , x1 , y2);
    graphics02.drawLine(x1 , y2 , x1 + rectWidth / 2 , y1);
    graphics02.drawLine(x1 + rectWidth / 2 , y1 , x2 , y2);

## 二、多点类图形 ##

这里的多点类图形即多边形和自由绘制。

1、多边形

多边形的绘制也可以看作多条直线的组合，其绘制思路是先用鼠标托出一条直线，再通过点击来绘制多边形的边，最后双击按键形成封闭图形。这里我们重点讲解点击与双击的实现。

点击：

这一步我们需要实现点击后将要从上一次点击的位置到本次点击的位置绘制一条直线，首先需要获取拖拽绘制直线的末端点作为点击直线的起点。这里需要定义四个新的变量用于保存拖拽线段末端点以及拖拽线段起点。并且设置一个布尔变量判断是否是第一条直线。

public void mouseReleased(MouseEvent e) {
         graphics02.drawLine(x1 , y1 , x2 , y2);
         //拖拽线段起点
         firstPointX = x1;
         firstPointY = y1;
         //拖拽线段终点
         x3 = x2;
         y3 = y2;
    }

接着来实现鼠标点击时直线的绘制，这里的核心思想是变量的更新，将前一个坐标传递给后一个，并且更新前一个坐标即可

public void mouseClicked(MouseEvent e) {
            graphics02.drawLine(x3 , y3 , x1 , y1);
            x3 = x1;
            y3 = y1;
    }

最后是双击，我们需要在鼠标单击时记录最后一个点的坐标，并在最后一个点和第一个点之间画一条直线即可，首先我们再定义两个变量用来保存最后一个点

public void mouseClicked(MouseEvent e) {
            graphics02.drawLine(x3 , y3 , x1 , y1);
            x3 = x1;
            y3 = y1;
            lastPointX = x1;
            lastPointY = y1;
    }

这里需要添加一个判断语句用来判断鼠标双击时候的功能，并再双击的功能中绘制最后一条直线。

public void mouseClicked(MouseEvent e) {
            if (MainPanel.name.equals("多边形")){
                if(e.getClickCount() == 2);
                    graphics02.drawLine(firstPointX , firstPointY , lastPointX , lastPointY);
                }
                graphics02.drawLine(x3 , y3 , x1 , y1);
                x3 = x1;
                y3 = y1;
                lastPointX = x1;
                lastPointY = y1;
            }
        }

注意：这里需要添加一个值来判断绘制直线的方法，因为绘制第一条直线和绘制剩下的直线使用的监听器不同，因此需要设置一个变量进行区分

public void mouseReleased(MouseEvent e) {
            if(!flag) {
                graphics02.drawLine(x1 , y1 , x2 , y2);
                firstPointX = x1;
                firstPointY = y1;
                x3 = x2;
                y3 = y2;
                flag = true;//设置flag用于区分两个监听器方法
            }
    }
    
     public void mouseClicked(MouseEvent e) {   
                if(e.getClickCount() == 2){
                    graphics02.drawLine(firstPointX , firstPointY , lastPointX , lastPointY);
                    flag = false;
                }
                graphics02.drawLine(x3 , y3 , x1 , y1);
                x3 = x1;
                y3 = y1;
                lastPointX = x1;
                lastPointY = y1;
            
        }

2、画笔功能

画笔的实现即需要在按下鼠标按键并移动鼠标时实时记录光标的坐标，因此这里将会使用到鼠标监听器中的mouseDragged方法。首先需要获取鼠标按键按下时的坐标，再获取鼠标拖动时的坐标，并将后者赋值给前者，这时画笔的数据就是实时更新的，下面时代码实现

public void mouseDragged(MouseEvent e) {
          
                draggX = e.getX();
                draggY = e.getY();
                graphics02.drawLine(x1 , y1 , draggX , draggY);
                ShapeList shapeList = new ShapeList(x1 , y1 , draggX , draggY , MainPanel.name , MainPanel.color);
                shapeArr1[Index] = shapeList;
                Index ++;
                x1 = draggX;
                y1 = draggY;
    
        }

同理橡皮的实现也是如此，只是将画笔颜色更改为背景颜色，并设置画笔粗细即可。

（持续更新）