Question

所以我有这个小程序（如果你喜欢的话，还是草图）。我的问题是，我应该怎么说，这些线条，当它们移动时，有点抖动和颤动。这与我的计算机的处理能力有关，还是应该以不同的方式对其进行编码？

这是代码：

int i, j;

void setup() {
  size(1440, 900);
  background(0);
  smooth();
  strokeWeight(10);
  i = width/2 - (width/2);
  j = width;
}

void draw() {
  fill(0, 10); // semi-transparent black
  stroke(0);
  rect(0, 0, width, height); //legger seg lag på lag

  if (i < width-200) {
    i+=4;
    j-=4;
  }
  else {
    i = width/2 - (width/2);
    j = width;
  }

  stroke(255);
  line(width/2, height, i, 30);
  line(width/2, height, i+40, 30);
  line(width/2, height, i+80, 30);
  line(width/2, height, i+120, 30);
  line(width/2, height, i+160, 30);
  line(width/2, height, i+200, 30);
  line(width/2, height, j, 30);
  line(width/2, height, j-40, 30);
  line(width/2, height, j-80, 30);
  line(width/2, height, j-120, 30);
  line(width/2, height, j-160, 30);
  line(width/2, height, j-200, 30);
}

Answer 1

使用JVisualVM快速了解后，发现有两个罪魁祸首：

渲染线
处理抗锯齿透明度

续线： 在幕后处理将每一行渲染为一个形状（beginShape() / endShape（）），在本例中使用LINES。您可以给Processing一个手，而不是使用多个beginShape / endShape调用（每行1个），只需使用一个用于所有行：

beginShape(LINES);
  for(int k = 0; k < 200; k+= 40){
    vertex(hw, height);vertex(i+k, 30);
    vertex(hw, height);vertex(j-k, 30);
  }
  endShape();

反别名和透明度 使用透明度通常在计算上很昂贵，特别是对于大图像。运行下面的代码段，按下鼠标按钮，查看未使用透明度时frameRate如何更改。

抗锯齿在计算上也很昂贵。没有透明度那么多，但另外，它也有所不同。按任意键可在别名和抗锯齿图形之间切换

Here are a few tweaks to your code:
int i, j;
int hw;
boolean smooth;
void setup() {
  size(1440, 900);
  background(0);

  strokeWeight(10);

  hw = width/2;
  i = width/2 - (width/2);//isn't this 0 ?
  j = width;
}

void draw() {
  fill(0,mousePressed ? 255 : 10); // semi-transparent black
  noStroke();
  rect(0, 0, width, height); //legger seg lag på lag
  if (i < width-200) {
    i+=4;
    j-=4;
  }
  else {
    i = 0;
    j = width;
  }

  stroke(255);
  beginShape(LINES);
  for(int k = 0; k < 200; k+= 40){
    vertex(hw, height);vertex(i+k, 30);
    vertex(hw, height);vertex(j-k, 30);
  }
  endShape();
  frame.setTitle((int)frameRate+" fps, smooth: " + smooth); 
}

void keyReleased(){
  smooth = !smooth;
  if(smooth) smooth();
  else       noSmooth();
}

Code Flutter（线条有点跳跃，看起来很糟糕）

1 个答案: