Question

我做了一个简单的绘图程序来绘制线条并增加/减少线条的粗细：

float strokeWeight = 2;

void setup() {
  size(640, 360);
  noSmooth();
  fill(126);
  background(255);
  strokeWeight(strokeWeight);
}

void draw() {
  background(0);
  ellipse(mouseX, mouseY, strokeWeight/2, strokeWeight/2);
  background(255);

  if (mousePressed) {
    stroke(0);
    line(mouseX, mouseY, pmouseX, pmouseY);
  }

  if (keyPressed) {
    if (key == '+') {
      strokeWeight = strokeWeight + 0.5;
      }
    if  (key == '-') {
      strokeWeight = strokeWeight - 0.5;
      }
     if (strokeWeight >= 0.5) {
      strokeWeight(strokeWeight);
     }
    }
}

现在我想用光标移动一个圆圈，指示线条的当前厚度。我试过这样的事情：

ellipse(mouseX, mouseY, strokeWeight/2, strokeWeight/2)

但是这种方式一遍又一遍地绘制椭圆。有没有办法去除＆＃34;擦除＆＃34;之前制作的圆圈？

Answer 1

我不是100％确定我已经理解了你的问题，但是你可能想要使用PGrahics，在你保留线条的情况下，另一方面你画圆圈。

float strokeWeight = 2;

PGraphics canvas;
PGraphics thickness_circle;

void setup() {
  size(640, 360);

  canvas = createGraphics(width, height);

  thickness_circle = createGraphics(width, height);

  thickness_circle.beginDraw();
  thickness_circle.noFill();
  thickness_circle.strokeWeight(1);
  thickness_circle.stroke(255, 0, 0);
  thickness_circle.endDraw();
}

void draw() {
  background(255);

  if (keyPressed) {
    if (key == '+') {
      strokeWeight += 0.5;
    }
    if  (key == '-') {
      strokeWeight -= 0.5;
    }
    strokeWeight = strokeWeight >= 0.5 ? strokeWeight : 0.5;
  }

  if (mousePressed) {    
    canvas.beginDraw();
    canvas.strokeWeight(strokeWeight);
    canvas.line(mouseX, mouseY, pmouseX, pmouseY);
    canvas.endDraw();
  }

  image(canvas, 0, 0);

  thickness_circle.beginDraw();
  thickness_circle.clear();
  thickness_circle.ellipse(mouseX, mouseY, strokeWeight, strokeWeight);
  thickness_circle.endDraw();

  image(thickness_circle, 0, 0);
}

处理 - 使用光标位置移动圆圈

1 个答案: