绘图图像(PGraphics)提供了围绕x轴镜像的不需要的双重图像。处理3

时间:2017-04-18 02:15:59

标签: image double processing pgraphics

代码应该淡化并将窗口的图像复制到缓冲区f,然后将f绘制回窗口,但是进行平移,旋转和缩放。当您将相机插入电视机的电视时,我正在尝试创建一个类似反馈循环的效果。

我已经尝试了所有我能想到的东西,记录了我能想到的每一个变量,但它仍然只是看起来像(f,0,0)做错了或意外。

我错过了什么?

关于x轴的双图像镜像:

should only be one trail of squares

PGraphics f;
int rect_size;
int midX;
int midY;

 void setup(){
  size(1000, 1000, P2D);
  f = createGraphics(width, height, P2D);
  midX = width/2;
  midY = height/2;
  rect_size = 300;
  imageMode(CENTER);
  rectMode(CENTER);
  smooth();
  background(0,0,0);
  fill(0,0);
  stroke(255,255);
}

void draw(){
  fade_and_copy_pixels(f); //fades window pixels and then copies pixels to f
  background(0,0,0);//without this the corners dont get repainted.
  //transform display window (instead of f)
  pushMatrix();
  float scaling = 0.90; // x>1 makes image bigger
  float rot = 5; //angle in degrees
  translate(midX,midY); //makes it so rotations are always around the center
  rotate(radians(rot));
  scale(scaling);
  imageMode(CENTER);
  image(f,0,0); //weird double image must have something not working around here
  popMatrix();//returns window matrix to normal
  int x = mouseX;
  int y = mouseY;
  rectMode(CENTER);
  rect(x,y,rect_size,rect_size);
}

//fades window pixels and then copies pixels to f
void fade_and_copy_pixels(PGraphics f){
  loadPixels();  //load windows pixels. dont need because I am only reading pixels?
  f.loadPixels(); //loads feedback loops pixels
  // Loop through every pixel in window
  //it is faster to grab data from pixels[] array, so dont use get and set, use this

  for (int i = 0; i < pixels.length; i++) {
      //////////////FADE PIXELS in window and COPY to f:///////////////
      color p = pixels[i];

      //get color values, mask then shift
      int r = (p & 0x00FF0000) >> 16;
      int g = (p & 0x0000FF00) >> 8;
      int b =  p & 0x000000FF; //no need for shifting

      // reduce value for each color proportional 
      // between fade_amount between 0-1 for 0 being totallty transparent, and 1 totally none
      // min is 0.0039 (when using floor function and 255 as molorModes for colors)
      float fade_percent= 0.005; //0.05 = 5%

      int r_new = floor(float(r) - (float(r) * fade_percent));
      int g_new = floor(float(g) - (float(g) * fade_percent));
      int b_new = floor(float(b) - (float(b) * fade_percent));
      //maybe later rewrite in a way to save what the difference is and round it differently, like maybe faster at first and slow later, 
       //round doesn't work because it never first subtracts one to get the ball rolling
      //floor has a minimum of always subtracting 1 from each value each time. cant just subtract 1 ever n loops
      //keep a list of all the pixel as floats? too much memory?
      //ill stick with floor for now
      // the lowest percent that will make a difference with floor is 0.0039?... because thats slightly more than 1/255

      //shift back and or together
      p = 0xFF000000 | (r_new << 16) | (g_new << 8) | b_new; // or-ing all the new hex together back into AARRGGBB

      f.pixels[i] = p;
      ////////pixels now copied
  }
  f.updatePixels(); 

}

2 个答案:

答案 0 :(得分:0)

这很奇怪。但让我们从一个更简单的MCVE开始,隔离问题:

PGraphics f;
void setup() {
  size(500, 500, P2D);
  f = createGraphics(width, height, P2D);
}

void draw() {
  background(0);
  rect(mouseX, mouseY, 100, 100);
  copyPixels(f); 
  image(f, 0, 0);
}

void copyPixels(PGraphics f) {
  loadPixels();
  f.loadPixels(); 

  for (int i = 0; i < pixels.length; i++) {
    color p = pixels[i];
    f.pixels[i] = p;
  }
  f.updatePixels();
}

此代码与您的代码存在相同的问题,没有任何额外的逻辑。我希望这段代码在鼠标所在的位置显示一个矩形,而是在X轴上反射的位置显示一个矩形。如果鼠标位于窗口的顶部,则矩形位于窗口的底部,反之亦然。

认为这是由P2D渲染器为OpenGL引起的,它具有反转的Y轴(0位于底部而不是顶部)。所以当你复制像素时,它似乎就是从屏幕空间到OpenGL空间......或者其他东西。这肯定看起来很麻烦。

目前,有两件事似乎可以解决这个问题。首先,您可以使用默认渲染器而不是P2D。这似乎解决了这个问题。

或者你可以摆脱for函数中的copyPixels()循环,暂时只执行f.pixels = pixels;。这似乎也解决了这个问题,但同样感觉很糟糕。

如果其他人(寻呼乔治)明天没有提供更好的解释,我会在Processing's GitHub上提交一个错误。 (如果你愿意,我可以帮你。)

修改:我提交了一个问题here,希望我们能在接下来的几天内收到开发人员的回复。

编辑二:看起来修补程序已经实施,应该可以在下一版本的Processing中使用。如果您现在需要它,您始终可以从源代码构建Processing。

答案 1 :(得分:0)

更容易,工作就像魅力一样:

添加f.beginDraw();之前和f.endDraw();使用f后:

loadPixels();  //load windows pixels. dont need because I am only reading pixels?
  f.loadPixels(); //loads feedback loops pixels
  // Loop through every pixel in window
  //it is faster to grab data from pixels[] array, so dont use get and set, use this

  f.beginDraw();

f.updatePixels(); 
  f.endDraw();

处理必须知道何时在缓冲区中绘图,何时不知道。

In this image you can see that works