Processing 点击图片波动动画代码示例

下面是一段使用 Processing 实现点击图片波动动画的代码：

 PImage img; // 定义图片对象
 float[] yValues; // 定义Y轴上的值
 int numWaves = 5; // 定义波浪数量
 float waveSpeed = 0.1; // 定义波浪速度

 void setup() {
  size(800, 600); // 设置窗口大小
  img = loadImage('image.jpg'); // 加载图片
  yValues = new float[img.width]; // 初始化Y轴上的值
 }

 void draw() {
  background(255); // 设置背景为白色
  image(img, 0, 0); // 绘制图片

  // 计算每个像素点的Y轴值
  for (int x = 0; x < img.width; x++) {
   float y = 0;
   for (int i = 0; i < numWaves; i++) {
    float angle = map(x, 0, img.width, 0, TWO_PI) + i * TWO_PI / numWaves;
    y += sin(angle) * yValues[x];
   }
   set(x, int(y), color(0)); // 设置像素点颜色
  }

  // 更新Y轴上的值
  for (int x = 0; x < img.width; x++) {
   yValues[x] = sin(frameCount * waveSpeed + x * 0.1) * 30;
  }
 }

 void mouseClicked() {
  if (mouseX >= 0 && mouseX < img.width && mouseY >= 0 && mouseY < img.height) {
   for (int x = 0; x < img.width; x++) {
    yValues[x] = 100; // 点击时将Y轴上的值设置为100
   }
  }
 }

代码中首先加载一张图片，并定义了一个Y轴上的值数组用于计算每个像素点的Y轴值。然后在draw()函数中，使用for循环遍历每个像素点，计算其Y轴值，并使用set()函数设置像素点颜色。接着在updateYValues()函数中，更新Y轴上的值，使其产生波浪效果。最后在mouseClicked()函数中，当图片被点击时，将Y轴上的值设置为100，从而产生波动动画效果。