用Java实现简单画板

         现在,我们来讲一下怎么用Java来实现简单画板,要实现的功能有:选择图形(方形、圆形、多边形...)、可以选择颜色。

         首先,打开windows下的画图软件,我们知道我们需要一个窗体(JFrame);我们要画画,需要画板;我们要选择图形、颜色,所以还应用到按钮组件,说到这里,我们所需要的原料基本完成了。接下来,我们要考虑布局:我们采用最简单的布局,窗体的最上面放选择图形的按钮,中间是画板,最下面是选择颜色的按钮。就是这样的:

我们把图形按钮、颜色按钮安排在两个面板上,画板为一个单独的面板,对于布局,我们使用的是BorderLayout()布局管理器,它会把背景组件分割成5个区域,分别为上下左右 中。图形按钮和颜色按钮挺多的,难道我们要一个个的添加吗?不是的,我们可以用数组来存储图图形信息和颜色信息,然后用循环来添加,速度快,日后也容易添加相应的按钮,扩展画板的功能。代码如下:

String [] Shape={"直线","曲线","圆","喷枪","橡皮擦","矩形","椭圆","圆角矩形","弧线","多边形","图形","三角形","立体圆","树叶"};   
    	for(int i=0;i<Shape.length;i++){
    		JButton button=new JButton(Shape[i]);
    		button.addActionListener(dl);    //添加事件监听机制
    		ShapePanel.add(button);
    	}        

Color [] color={Color.BLACK,Color.blue,Color.white,Color.gray,Color.red,Color.CYAN,Color.green,Color.darkGray,Color.pink};
    	for(int i=0;i<color.length;i++){
    		JButton button=new JButton();
    		button.addActionListener(dl);   //添加事件监听机制
    		button.setPreferredSize(new Dimension(30,30));
    		button.setBackground(color[i]);
    		ColorPanel.add(button);
    	}
到这里,我们的UI就大功告成啦,可以喝杯茶休息 一下啦。

         我们的画板要怎么知道用户点击了那一个图形按钮和颜色按钮呢?是的,我们会想到事件监听。但事件监听只是告诉我们用户按下了按钮呀?我们又怎么知道这是个颜色按钮还是图形按钮呀?是什么图形呀?是什么颜色呀?这是我们接下来要解决的问题。

        在上面创建图形按钮和颜色按钮的时候,不知道你有没有发现两种按钮的不同呢?是的,图形按钮有标题,颜色按钮有背景颜色,我们可以根据这一点来判断用户按下的是图形按钮还是颜色按钮。那要怎么来取得按钮所传递过来的图形和颜色信息呢?我们可以在监听类里面添加Shape和Color属性来保存。代码如下:

public void actionPerformed(ActionEvent e){
	    if(e.getActionCommand().equals("")){      //如果没有信息,那就是颜色按钮
	    	JButton button = (JButton) e.getSource();  
			color = button.getBackground();   
			System.out.println("color = " + color);
	    }else{
	    	JButton button = (JButton) e.getSource();  
			shape = button.getActionCommand();   
			System.out.println("String = " + shape);
	    }
	}
        哇,到了这里,我们的工作已经完成一大半啦。

        接下来就是根据获取到的颜色和图形信息进行画画啦。先说一下最简单的设置颜色,我们只需在用户按下鼠给画笔设置颜色属性就好。

       那我们要怎么画图形呢?图形的完成有在鼠标点击是就完成的,有拖动完成的,有按下拖动然后松开才完成的....要怎么实现呢?是的,判断,根据Shape来判断,并做出相应的动作。

      按下就完成的图形有:方形、圆形、弧线....这些图形的绘制也比较简单,只需获取点下的坐标值就可以进行画图了。如下:

 public void mousePressed(MouseEvent e) {
		 g=(Graphics2D) df.getGraphics();
		 g.setColor(color);
		 x1=e.getX();
		 y1=e.getY();
		 if(shape.equals("圆")){
			 g.drawOval(x1, y1, 30, 30);
		 }else if(shape.equals("矩形")){
			 g.drawRect(x1, y1, 30, 40);
		 }else if(shape.equals("圆角矩形")){
			 g.drawRoundRect(x1, y1, 30, 40, 5, 10);
		 }else if(shape.equals("椭圆")){
			 g.drawOval(x1, y1, 30, 20);
		 }else if(shape.equals("弧线")){
			 g.drawArc(x1, y1, 100, 60, 0, 180);
		 }
	 }
       按下并拖动才能完成的有:直线。我们只需记录下按下是的坐标与松开是的坐标,然后连接两点,就可以画直线了。代码如下:
 public void mouseReleased(MouseEvent e) {
			x2 = e.getX();
			y2 = e.getY();
			if (shape.equals("直线")) {
				g.drawLine(x1, y1, x2, y2);
			}else if(shape.equals("多边形")&&!flag){
				g.drawLine(x1, y1, x2, y2);
				newx1=x1;
				newy1=y1;
				newx2=x2;
				newy2=y2;
				flag=true;
			}

	 }
         拖动完成的有:曲线、橡皮擦、喷枪。曲线,我们也是用画线的方法来实现,但我们每次只画一个点,即起始坐标相同,却每次画点的坐标为鼠标拖动过程中每一位置的坐标。橡皮擦呢?我们先把画笔颜色设置成画板背景色,用画曲线的方法,即鼠标所在的地方都画成背景色,实现橡皮擦的功能,为了突出效果,我们使用Graphics2D,把画笔调粗。这样,效果更加明显。喷枪,我们使用的是随机数,及拖动鼠标过程中,同时随机的画出数十个点,来模拟喷枪随机的效果。代码如下:
 public void mouseDragged(MouseEvent e) {
			x2 = e.getX();
			y2 = e.getY();
			if (shape.equals("曲线")) {
//				g.setStroke(new BasicStroke(10));			
//				g.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
				g.drawLine(x1, y1, x2, y2);
				x1 = x2;
				y1 = y2;
			}else if(shape.equals("橡皮擦")){
				g.setStroke(new BasicStroke(80));							
				g.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
				g.setColor(Color.WHITE);
				g.drawLine(x1, y1, x2, y2);
				x1 = x2;
				y1 = y2;
			}else if(shape.equals("喷枪")){
			//	g.setStroke(new BasicStroke(2));	  //不用加粗						
			//	g.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
				for(int k=0;k<20;k++){
					Random i=new Random();       
					int a=i.nextInt(8);
					int b=i.nextInt(10);
					g.drawLine(x2+a, y2+b, x2+a, y2+b);
				}
			}
		}
           接下来,重点讲一下多边形的绘制。在绘制多变形时,第一条边与画直线是一样的,往后,鼠标每点一次,就画一条直线,当鼠标点两下时,就画两条直线,形成封闭的多边形。怎么实现呢?最重要的是要用四个变量来存储上一个点的坐标与最开始的坐标,每点一次,就在新的点与上一个点之间画直线,点两次就多画一条直线,围成封闭图形。代码如下:

 public void mouseClicked(MouseEvent e) {
		 if(shape.equals("多边形")&&flag){
			 x2=e.getX();        //获取新的点的坐标
			 y2=e.getY();
			 if(e.getClickCount()==2){
				 g.drawLine(newx1, newy1, newx2, newy2);
				 flag=false;
			 }
			 g.drawLine(newx2, newy2, x2, y2);
			 
			 newx2=x2;   //存下上个点的坐标
			 newy2=y2;
		    }
}


      到这里,我们终于大功告成啦,虽然还是很小儿科,但这是我们编程路上很重要的一步啦。看一下成果图吧:





评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值