前言继上篇笔记当时鼠标监听器绑定在JFrame窗体上会出现绘图坐标错位同时任意三角形交互逻辑不完善。本次修复坐标偏移问题完善自定义三角形绘制逻辑使用flag状态变量控制多步绘图流程。一、实现思路这个画图工具的核心就是窗体 事件监听器。我们分成两大块来写DrawUI3 负责搭建窗口、创建顶部按钮面板、白色绘图画布鼠标监听器绑定绘图面板解决坐标错位把监听器绑定到按钮上。DrawListener3 实现 ActionListener 和 MouseListener 接收按钮点击事件、鼠标按下/松开/单击事件拿到画布画笔去绘图使用flag标记记录绘图阶段。整体流程点击图形/颜色按钮 → 记录当前选中的功能重置绘图状态 → 在白色画布上操作鼠标 → 监听器捕获画布鼠标坐标 → 一步式图形直接绘图自定义三角形先拖拽底边flag切换状态单击画布获取第三个顶点完成闭合。二、实现步骤步骤1搭建主窗体我们先创建 JFrame 窗口设置大小、标题、关闭方式使用BorderLayout布局上方放置JPanel存放功能按钮中间JPanel作为白色绘图画布创建各个功能按钮直线、矩形、等腰三角形、三角形、蓝色、红色、黑色步骤2编写监听器监听器需要实现两个接口1、ActionListener 监听按钮点击记住现在要画什么图形 / 什么颜色切换按钮重置flag状态。2、MouseListener 监听鼠标按下、松开、单击获取坐标完成绘图。需要定义的变量1、Graphics gr 画笔2、x1,y1 鼠标按下起点 x2,y2 鼠标松开终点 x3,y3 三角形第三个点3、String name 保存当前选中的功能名称4、boolean flag绘图状态标记true可以拖拽绘制底边false等待单击获取三角形顶点然后重写五个鼠标方法 按钮响应方法1、actionPerformed() 按钮被点击更新 name、设置画笔颜色重置flag绘图状态2、mousePressed() 鼠标按下flag为true时记录起点 x1,y13、mouseReleased() 鼠标松开拿到终点 x2,y2执行直线、矩形、等腰三角形三角形模式绘制底边将flag置为false等待单击4、mouseClicked()鼠标单击flag为false时获取三角形第三个点连线闭合三角形重置flag5、mouseEntered / mouseExited 接口必须实现这里暂时留空三、代码案例packagesy0922;importjavax.swing.*;importjava.awt.*;importjava.net.http.WebSocket;publicclassDrawUI3{publicvoidinitUI(){JFramejfnewJFrame();jf.setTitle(画图工具);jf.setSize(800,800);jf.setLocationRelativeTo(null);jf.setDefaultCloseOperation(3);JPanelnorthPanelnewJPanel();northPanel.setBackground(Color.PINK);northPanel.setPreferredSize(newDimension(0,40));jf.add(northPanel,BorderLayout.NORTH);JButtonjbunewJButton(直线);northPanel.add(jbu);JButtonjbu2newJButton(矩形);northPanel.add(jbu2);JButtonjbu3newJButton(等腰三角形);northPanel.add(jbu3);JButtonjbu4newJButton(三角形);northPanel.add(jbu4);JButtonjbu5newJButton(多边形);northPanel.add(jbu5);JButtonbluenewJButton(蓝色);northPanel.add(blue);JButtonrednewJButton(红色);northPanel.add(red);JButtonblacknewJButton(黑色);northPanel.add(black);JPaneldrawPanelnewJPanel();jf.add(drawPanel,BorderLayout.CENTER);jf.setVisible(true);GraphicsgdrawPanel.getGraphics();DrawListener3listenernewDrawListener3();listener.grg;drawPanel.addMouseListener(listener);jbu.addActionListener(listener);jbu2.addActionListener(listener);jbu3.addActionListener(listener);jbu4.addActionListener(listener);jbu5.addActionListener(listener);blue.addActionListener(listener);red.addActionListener(listener);black.addActionListener(listener);listener.grg;}publicstaticvoidmain(String[]args){DrawUI3uinewDrawUI3();ui.initUI();}}packagesy0922;importjava.awt.*;importjava.awt.event.ActionEvent;importjava.awt.event.ActionListener;importjava.awt.event.MouseEvent;importjava.awt.event.MouseListener;publicclassDrawListener3implementsMouseListener,ActionListener{publicGraphicsgr;publicintx1,y1,x2,y2,x3,y3;publicStringname;publicbooleanflagtrue;publicvoidactionPerformed(ActionEvente){namee.getActionCommand();if(蓝色.equals(name)){gr.setColor(Color.blue);}if(红色.equals(name)){gr.setColor(Color.red);}if(黑色.equals(name)){gr.setColor(Color.black);}}publicvoidmouseClicked(MouseEvente){x3e.getX();y3e.getY();if(三角形.equals(name)){gr.drawLine(x1,y1,x3,y3);gr.drawLine(x2,y2,x3,y3);flagtrue;}}publicvoidmousePressed(MouseEvente){if(flagtrue){x1e.getX();y1e.getY();}}publicvoidmouseReleased(MouseEvente){if(flagtrue){x2e.getX();y2e.getY();}intwMath.abs(x1-x2);intmxMath.min(x1,x2);if(直线.equals(name)){gr.drawLine(x1,y1,x2,y2);}if(矩形.equals(name)){gr.drawRect(mx,y1,w,y2-y1);}if(等腰三角形.equals(name)){gr.drawLine(x1,y2,(x1x2)/2,y1);gr.drawLine((x1x2)/2,y1,x2,y2);gr.drawLine(x1,y2,x2,y2);}if(三角形.equals(name)){gr.drawLine(x1,y1,x2,y2);flagfalse;}}publicvoidmouseEntered(MouseEvente){}publicvoidmouseExited(MouseEvente){}}运行结果五、学习小结画图工具的实现本身不难难的是状态管理。像直线这种“一步完成”的图形很好写但像任意三角形这种需要两次鼠标动作的图形就必须使用flag变量记住程序当前处于哪一个阶段。同时理解不同组件的鼠标坐标原点差异监听器绑定不同组件拿到的鼠标坐标结果完全不一样。后续还可以继续拓展实现清空画布、多边形绘制等功能。
