处理中的变形图像效果

Question

我想建立一种图像变形处理工具。与此链接中的内容类似：

https://giphy.com/gifs/painting-morph-oil-c8ygOpL64UDuw

实现这一点的第一步是构建一个二维像素网格。像素填充颜色。填充颜色是通过使用get（）；函数从图像（PImage img1；）中读取颜色来创建的。这就是我如何用我的像素重建图像。在第二步中，我认为我将使用lerp（）；函数给相应的像素第二张图像的颜色（PImage img2；）-我认为这将创建所需的变形效果。但是我错了！整件事都起作用了-但是效果只是两个图像之间发生了淡入。没有变形。当这种变形效果出现时，像素会发生什么？我如何在处理中重新创建它？

float pixel;
float pixelsize;
PImage img1;
PImage img2;
float counter;

void setup() {
  size(1080, 1080);
  pixel = 100;
  pixelsize = width/pixel;
  noStroke();
  img1 = loadImage("0.jpg");
  img2 = loadImage("1.jpg");
  counter = 0;
}


void draw() {
  background(255);

  for (int y = 0; y < pixel; y++) {
    for (int x = 0; x < pixel; x++) {
      color c1 = img1.get(int(pixelsize*x), int(pixelsize*y));
      color c2 = img2.get(int(pixelsize*x), int(pixelsize*y));

      color from = c1;
      color to = c2;
      color interA = lerpColor(from, to, counter);

      pushMatrix();
      translate(pixelsize*x, pixelsize*y);
      fill(interA);
      rect(0, 0, pixelsize, pixelsize);
      popMatrix();
    }
  }
  counter= counter + 0.01;
}

Answer 1

这很好地描述了它——它比我想象的要复杂得多！

图像变形