Processing(1) - 练习

最新推荐文章于 2025-09-13 14:12:38 发布

原创最新推荐文章于 2025-09-13 14:12:38 发布 · 1.9k 阅读

3 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

Processing Language 专栏收录该内容

35 篇文章

订阅专栏

这篇博客介绍了Processing的初步练习，特别是如何在窗口中根据鼠标移动速度绘制不同粗细的线条。通过使用dist()函数计算鼠标移动的两点间距离，实现线条粗细与鼠标移动速度的反比关系。文章提供了具体的执行结果展示。

Processing - 练习（1）

实例1 - 在窗口划线条

关键：
鼠标运行慢的时候，线条变粗；
快的时候线条变细；

int wh;

void setup()
{   
  size(640,220); 
  background(0);

}

void draw()
{
  fill(0);
  stroke(255);
  if (mousePressed)
  {
     float spn = dist(mouseX,mouseY,pmouseX,pmouseY);
     strokeWeight(5/spn + 3.0);
     line(pmouseX,pmouseY,mouseX,mouseY);  
  }
}

说明：
1. dist(p1x, p1y, p2x, p2y)，用来计算两点之间的距离；
2. 根据鼠标跨越的距离来决定线条粗细，两者成反比例关系；

执行结果：

// 用easing作出平滑曲线
float x,y;
float px,py;
float easing;

void setup()
{
    size(720,404);
    smooth();
    stroke(0,202);
    x = 0.5 * width;
    y = 0.5 * height;
    easing = 0.05;
}

void draw()
{
    float targetX = mouseX;
    float targetY = mouseY;
    x += (targetX - x) * easing;
    y += (targetY - y) * easing;
    float weight = 64.0 / (3 + dist(x,y,px,py));
    strokeWeight(weight);
    line(x,y,px,py);
    py = y;
    px = x;
}