问题在绘制线条的同时拖动鼠标 [英] Issue in drawing lines while mouse dragging

问题描述

我工作的一个小程序的油漆，吸引了不同的形状。我想画线，同时拖动鼠标。的问题是，当该行显​​示，它们被如下图所示。

我有一个使用一个点构造类线（起点）
它有一个名为 setDragPoint 方法，它采用鼠标拖拽点，以画线，同时拖动 drawingImage 品牌太多的闪烁，而在拖曳模式绘图。为什么会发生呢？

 进口java.applet中的*。
java.awt.event中导入*。
进口java.awt中的*。
进口的java.util。*;公共类画笔扩展的Applet实现的MouseListener，{的MouseMotionListener形状的形状;
点的startPoint;
点dragPoint;
ArrayList的＆LT;形状和GT;形状;
选择shapeChoice;
选择colorChoice;
选择fillChoice;
图片drawingImage;
图形drawGraphics;
串shapeString，colorString，fillString;
布尔isDragMode;公共无效的init（）{
    形状=新的ArrayList＆LT;形状和GT;（）;
    shapeChoice =新选择（）;
    shapeChoice.addItem（线）;
    shapeChoice.addItem（矩形）;
    shapeChoice.addItem（ROUNDRECT）;
    shapeChoice.addItem（椭圆形）;
    shapeChoice.addItem（写意）;    加（shapeChoice）;    colorChoice =新选择（）;
    colorChoice.addItem（红楼梦）;
    colorChoice.addItem（绿色）;
    colorChoice.addItem（蓝色）;    加（colorChoice）;    fillChoice =新选择（）;
    fillChoice.addItem（补缺）;
    fillChoice.addItem（谷）;
    加（fillChoice）;    shapeString = shapeChoice.getSelectedItem（）;
    colorString = colorChoice.getSelectedItem（）;
    fillString = fillChoice.getSelectedItem（）;    drawingImage =的createImage（的getSize（）宽的getSize（）的高度。）;
    drawGraphics = drawingImage.getGraphics（）;
    的System.out.println（设置图像）;
    drawGraphics.setColor（Color.black）;
    drawGraphics.fillRect（0，0，的getSize（）宽度，的getSize（）高度。）;
    drawGraphics.setColor（Color.orange）;
    drawGraphics.drawRect（0，0，的getSize（）宽度 -  1，的getSize（）高度 -  1）;
    drawGraphics.drawRect（1，1，的getSize（）宽度 -  3，的getSize（）高度 -  3）;
    的startPoint =新点（0，0）;
    dragPoint =新点（0，0）;
    addMouseListener将（本）;
    addMouseMotionListener（本）;
}公共无效的mouseEntered（的MouseEvent E）{
}公共无效的mouseExited（的MouseEvent E）{
}公共无效的mouseClicked（的MouseEvent E）{
}公共无效鼠标pressed（的MouseEvent E）{    的System.out.println（pressed）;    startPoint.x = e.getX（）;
    startPoint.y = e.getY（）;
    重绘（）;    开关（shapeString）{
        案线：
            形状=新线（startPoint.x，startPoint.y）; //第1步在这里，我使用的起点（在该点鼠标pressed）构造一个新行            打破;
        案写意：
            形状=新FreeShape（）;
            打破;
    }
    }公共无效的mouseReleased（的MouseEvent E）{
    如果（isDragMode）{
        shapes.add（形状）;
        isDragMode = FALSE;
     }
    重绘（）;}公共无效的mouseMoved（的MouseEvent E）{
}公共无效的mouseDragged（的MouseEvent E）{
    的System.out.println（拖）;
    isDragMode = TRUE;
    dragPoint.x = e.getX（）;
    dragPoint.y = e.getY（）;    开关（shapeString）{
        案线：
            shape.setDragPoint（dragPoint.x，dragPoint.y）; //这里我设置了阻力点，已创建的线在步骤1
              打破;
        案写意：
            形状=新FreeShape（）;
            打破;
    }    shape.drawWhileDragging（drawGraphics）; //我把这种方法来绘制，而鼠标拖动是    重绘（）;
}公共无效漆（图形G）{  更新（G）;
}
 公共无效更新（图形G）{  //创建一个离屏图形如果没有绘图环境
  //存在
  //或者如果用户调整该applet画图区到不同的
 //大小
   如果（drawingImage == NULL）
{的System.out.println（图像为null）;
    drawingImage =的createImage（的getSize（）宽的getSize（）的高度。）;
drawGraphics = drawingImage.getGraphics（）;
}  //删除previous图像
  drawGraphics.setColor（Color.black）;
  drawGraphics.fillRect（0,0，的getSize（）宽度，的getSize（）高度。）;
  drawGraphics.setColor（Color.orange）;
  drawGraphics.drawRect（0,0，的getSize（）宽度-1，的getSize（）高度-1）;
  drawGraphics.drawRect（1,1，的getSize（）宽度-3，的getSize（）高度-3）;   对于（形状小号：形状）
         s.draw（drawGraphics）;  //屏幕外的图像绘制到applet的观察窗
  g.drawImage（drawingImage，0,0，本）;   }
 }
抽象类Shape {颜色shapeColor;
布尔填补;抽象无效抽奖（图形G）;无效drawWhileDragging（图形G）{
}无效setDragPoint（INT X，int y）对{
}
} 班线延伸形状{私人点的startPoint;
私人点currentPoint;公共点getStartPoint（）{
    返回的startPoint;
}公共点getCurrentPoint（）{
    返回currentPoint;
}公共无效setStartPoint（点对点）{
    this.startPoint =点;
}公共无效setCurrentPoint（点对点）{
    this.currentPoint =点;
}无效drawWhileDragging（图形G）{
    g.drawLine（startPoint.x，startPoint.y，currentPoint.x，currentPoint.y）;
}公共无效抽奖（图形G）{
    g.drawLine（startPoint.x，startPoint.y，currentPoint.x，currentPoint.y）;
}线（）{
    的startPoint =新点（0，0）;
    currentPoint =新点（0，0）;
}线（INT X1，Y1 INT）{
    这个（）;
    this.startPoint.x = X1;
    this.startPoint.y = Y1;
}无效setDragPoint（INT X，int y）对{
    this.currentPoint.x = X;
    this.currentPoint.y = Y;
    的System.out.println（当前-X：+ currentPoint.x +currentPoint-Y+ currentPoint.y）;
    的System.out.println（开始-X：+ startPoint.x +的startPoint-Y+ startPoint.y）;
  } }类FreeShape扩展形状{私人的ArrayList＆LT;点和GT; dragPoints =新的ArrayList＆LT;点和GT;（）;公众的ArrayList＆LT;点和GT; getDragPoints（）{
    返回dragPoints;
}公共无效setDragPoints（点对点）{
    dragPoints.add（点）;
}公共无效抽奖（图形G）{
}公共FreeShape（）{
  }
}
类Rectangle扩展形状{公共无效抽奖（图形G）{
   }
 }
类椭圆形扩展{公共无效抽奖（图形G）{
   }
 }
 

解决方案

我最近写了类似类型的应用程序。下面是截图。这还没有发育完全，你可以看到。

现在，我还你现在面临面临类似的问题。你要做的是什么。

• 双缓冲所有的绘画操作


• 请不要通过调用重绘清除屏幕。 重绘实际上首先填充用背景色和放大器屏幕;那就是你所看到的闪烁。

您可以让当前屏幕的画布的副本在图片。在图片将每绘制操作后更新。因此，而不是通过调用清除屏幕的重绘你做的是吸取图片在画布上。这就好比双缓冲。

在您的code你调用重绘每当鼠标拖动的时间。这是闪烁的原因。

---

更新

我在你最近更新code发现三大问题

• 在 drawWhileDragging 方法你不改变这一行图形上下文绘制颜色。因此，该行被黑色的实际画，和你的背景是黑色的了。因此，你看不到任何东西。


• 在此同样的方法你传递一个图形上下文 drawingImage 的（即参考）。因此该行实际上是绘制屏幕外的图像上，而不是在屏幕上。


• 在你每次调用后拖重绘的mouseDragged 方法。其结果是没有什么实际彩绘

我已经在我的机器上运行code，并进行了必要的changes.I我张贴仅将更改的方法来保持它短。

下面是更新的mouseDragged 法

 公共无效的mouseDragged（的MouseEvent E）{
        的System.out.println（拖）;
        isDragMode = TRUE;
        dragPoint.x = e.getX（）;
        dragPoint.y = e.getY（）;        开关（shapeString）{
            案线：
                shape.setDragPoint（dragPoint.x，dragPoint.y）; //这里我设置了阻力点，已创建的线在步骤1
                打破;
            案写意：
                形状=新FreeShape（）;
                打破;
        }        的getGraphics（）调用drawImage（drawingImage，0,0，NULL）; //添加此行
        shape.drawWhileDragging（的getGraphics（））; //我把这种方法来绘制，而鼠标拖动是
    }
 

下面是更新 drawWhileDragging 法

 无效drawWhileDragging（图形G）{
        g.setColor（Color.ORANGE）;
        g.drawLine（startPoint.x，startPoint.y，currentPoint.x，currentPoint.y）;
        g.setColor（Color.BLACK）;
    }
 

唉，我设置颜色为橙色。你所要做的是根据选菜单设置颜色。

您可以实现类似的比喻绘制其他形状。

I'm working on a paint applet that draws different shapes. I want to draw lines while dragging the mouse. The problem is that when the lines appear, they are as shown in the image below.

I have class line that's constructed using one point (start point) and it has a method called setDragPoint that takes the mouse drag points in order to paint lines while dragging also the drawingImage makes too many flickers while drawing in dragging mode. Why does that happen?

import java.applet.*;
import java.awt.event.*;
import java.awt.*;
import java.util.*;

public class PaintBrush extends Applet implements MouseListener, MouseMotionListener {

Shape shape;
Point startPoint;
Point dragPoint;
ArrayList<Shape> shapes;
Choice shapeChoice;
Choice colorChoice;
Choice fillChoice;
Image drawingImage;
Graphics drawGraphics;
String shapeString, colorString, fillString;
boolean isDragMode;

public void init() {
    shapes = new ArrayList<Shape>();
    shapeChoice = new Choice();
    shapeChoice.addItem("Line");
    shapeChoice.addItem("Rectangle");
    shapeChoice.addItem("RoundRect");
    shapeChoice.addItem("Oval");
    shapeChoice.addItem("FreeHand");

    add(shapeChoice);

    colorChoice = new Choice();
    colorChoice.addItem("Red");
    colorChoice.addItem("Green");
    colorChoice.addItem("Blue");

    add(colorChoice);

    fillChoice = new Choice();
    fillChoice.addItem("Filled");
    fillChoice.addItem("Hollow");
    add(fillChoice);

    shapeString = shapeChoice.getSelectedItem();
    colorString = colorChoice.getSelectedItem();
    fillString = fillChoice.getSelectedItem();

    drawingImage = createImage(getSize().width, getSize().height);
    drawGraphics = drawingImage.getGraphics();
    System.out.println("set up image");
    drawGraphics.setColor(Color.black);
    drawGraphics.fillRect(0, 0, getSize().width, getSize().height);
    drawGraphics.setColor(Color.orange);
    drawGraphics.drawRect(0, 0, getSize().width - 1, getSize().height - 1);
    drawGraphics.drawRect(1, 1, getSize().width - 3, getSize().height - 3);
    startPoint = new Point(0, 0);
    dragPoint = new Point(0, 0);
    addMouseListener(this);
    addMouseMotionListener(this);
}

public void mouseEntered(MouseEvent e) {
}

public void mouseExited(MouseEvent e) {
}

public void mouseClicked(MouseEvent e) {
}

public void mousePressed(MouseEvent e) {

    System.out.println("Pressed");

    startPoint.x = e.getX();
    startPoint.y = e.getY();
    repaint();

    switch (shapeString) {
        case "Line":
            shape = new Line(startPoint.x, startPoint.y);  //step 1 here i construct a new line using the start point (the point at which the mouse is pressed)

            break;
        case "FreeHand":
            shape = new FreeShape();
            break;
    }


    }

public void mouseReleased(MouseEvent e) {
    if (isDragMode) {
        shapes.add(shape);
        isDragMode = false;
     }
    repaint();

}

public void mouseMoved(MouseEvent e) {
}

public void mouseDragged(MouseEvent e) {
    System.out.println("Dragged");
    isDragMode = true;
    dragPoint.x = e.getX();
    dragPoint.y = e.getY();

    switch (shapeString) {
        case "Line":
            shape.setDragPoint(dragPoint.x, dragPoint.y);  //here i set the drag points to the already created line at step 1 
              break;
        case "FreeHand":
            shape = new FreeShape();
            break;
    }

    shape.drawWhileDragging(drawGraphics); // i call this method to draw while mouse is dragging

    repaint();


}

public void paint(Graphics g) {

  update(g);
}
 public void update(Graphics g) {

  // create an off-screen graphics drawing environment if none
  //existed
  // or if the user resized the applet drawing area to a different
 // size
   if (drawingImage == null)
{

System.out.println("Image is Null");
    drawingImage = createImage(getSize().width,getSize().height);
drawGraphics = drawingImage.getGraphics();
}



  // erase the previous image
  drawGraphics.setColor(Color.black);
  drawGraphics.fillRect(0,0,getSize().width,getSize().height);
  drawGraphics.setColor(Color.orange);
  drawGraphics.drawRect(0,0,getSize().width-1,getSize().height-1);
  drawGraphics.drawRect(1,1,getSize().width-3,getSize().height-3);  

   for(Shape s:shapes)
         s.draw(drawGraphics);

  // paint the offscreen image to the applet viewing window
  g.drawImage(drawingImage,0,0,this);

   }
 }


abstract class Shape {

Color shapeColor;
boolean filled;

abstract void draw(Graphics g);

void drawWhileDragging(Graphics g) {
}

void setDragPoint(int x, int y) {
}
}

 class Line extends Shape {

private Point startPoint;
private Point currentPoint;

public Point getStartPoint() {
    return startPoint;
}

public Point getCurrentPoint() {
    return currentPoint;
}

public void setStartPoint(Point point) {
    this.startPoint = point;
}

public void setCurrentPoint(Point point) {
    this.currentPoint = point;
}

void drawWhileDragging(Graphics g) {
    g.drawLine(startPoint.x, startPoint.y, currentPoint.x, currentPoint.y); 
}

public void draw(Graphics g) {
    g.drawLine(startPoint.x, startPoint.y, currentPoint.x, currentPoint.y);
}

Line() {
    startPoint = new Point(0, 0);
    currentPoint = new Point(0, 0);
}

Line(int x1, int y1) {
    this();
    this.startPoint.x = x1; 
    this.startPoint.y = y1;
}

void setDragPoint(int x, int y) {
    this.currentPoint.x = x;
    this.currentPoint.y = y;
    System.out.println("Current-X:" + currentPoint.x + " currentPoint-Y" + currentPoint.y);
    System.out.println("start-X:" + startPoint.x + " startPoint-Y" + startPoint.y);
  }

 }

class FreeShape extends Shape {

private ArrayList<Point> dragPoints = new ArrayList<Point>();

public ArrayList<Point> getDragPoints() {
    return dragPoints;
}

public void setDragPoints(Point point) {
    dragPoints.add(point);
}

public void draw(Graphics g) {
}

public FreeShape() {
  }
}


class Rectangle extends Shape {

public void draw(Graphics g) {
   }
 }


class Oval extends Shape {

public void draw(Graphics g) {
   }
 }

解决方案

I have written a similar type of app recently. Here is the screenshot. It is not fully developed as you can see.

Now, I also faced similar problems as you are facing now. What you have to do is.

• Double Buffer all painting operations
• Do not clear the screen by calling repaint. Repaint actually first fills the screen with the background color & and that is the flicker you are seeing.

You can make a copy of the current screen canvas in an Image. The Image will be updated after every drawing operations. So Instead of clearing the screen by calling repaint what you do is draw the Image on the canvas. This is like double buffering.

In your code you are calling repaint every time the mouse is dragged. That is the cause of the flicker.

---

UPDATE

Three major issues I found in your newly updated code

• In the drawWhileDragging Method you are not changing the line graphics context drawing color. So the line is actually drawn in black, and your background is black too. As a result you cannot see anything.
• In this same method you are passing a graphics context (i.e. reference) of drawingImage. As a result the line is actually drawn on the offscreen image, not on the screen.
• In mouseDragged method you are calling repaint after each drag. As a result nothing is actually painted

I have run your code on my machine and have made the necessary changes.I am posting only the changed methods to keep it short.

Here is the updated mouseDragged method

    public void mouseDragged(MouseEvent e) {
        System.out.println("Dragged");
        isDragMode = true;
        dragPoint.x = e.getX();
        dragPoint.y = e.getY();

        switch (shapeString) {
            case "Line":
                shape.setDragPoint(dragPoint.x, dragPoint.y);  //here i set the drag points to the already created line at step 1
                break;
            case "FreeHand":
                shape = new FreeShape();
                break;
        }

        getGraphics().drawImage(drawingImage, 0,0,null); //Added this line
        shape.drawWhileDragging(getGraphics()); // i call this method to draw while mouse is dragging
    }

Here is the updated drawWhileDragging method

    void drawWhileDragging(Graphics g) {
        g.setColor(Color.ORANGE);
        g.drawLine(startPoint.x, startPoint.y, currentPoint.x, currentPoint.y);
        g.setColor(Color.BLACK);
    }

Well, I have set the color to orange. What you have to do is to set the color according to the Choice menu.

You can implement a similar analogy for drawing other shapes as well.

这篇关于问题在绘制线条的同时拖动鼠标的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！