Overlay Transparent PGraphics

edited February 2017 in Questions about Code

I want overlay two PGraphics on white background.
I tried:
PGraphics.tint() --> do not work at all
PGraphics mask --> strange results and black background
Here is my code for test:

PGraphics pg0, pg1, mymask0, mymask1, whiteMask, white;
float t0 = 0;
float t1 = 0;
void setup() 
{
  size(200, 200);
  smooth();
  pg0 = createGraphics(200, 200);
  pg1 = createGraphics(200, 200);
  mymask0 = createGraphics(200, 200);  
  mymask1 = createGraphics(200, 200);  
  whiteMask = createGraphics(200, 200);  
  white = createGraphics(200, 200);  
  white.beginDraw();
  white.noStroke();
  white.fill(255);
  white.rect(0,0,200,200);
  white.endDraw();
  makepg0();
  makepg1();
}
void draw() 
{
  // white background;
  background(255);
  //image(white,0,0);  
  //updateMask1();    
  //image(pg1, 0, 0);      
  updateMask0();
  //pg0.tint(255,128);
  image(pg0, 0, 0);    
  //tint(255,128);
  updateMask1();  
  image(pg1, 0, 0);  
  //tint(255,128);
}

void whiteMask()
{
  whiteMask.beginDraw();
  whiteMask.background(255);
  whiteMask.endDraw();
  white.mask(whiteMask);
}
void updateMask1()
{
  mymask1.beginDraw();
  mymask1.background(t1);
  mymask1.endDraw();
  pg1.mask(mymask1);

}
void updateMask0()
{
  mymask0.beginDraw();
  mymask0.background(t0);
  //mymask0.background(255);
  mymask0.endDraw();
  pg0.mask(mymask0);
}
void makepg0() // yellow rect
{
  pg0.smooth();
  pg0.beginDraw();
  pg0.fill(255,255,0);
  pg0.rect(50, 50, 100, 100);
  pg0.endDraw(); 
}
void makepg1() // red rect
{
  pg1.smooth();
  pg1.beginDraw();
  pg1.fill(255,0,0);
  pg1.rect(30, 30, 100, 100);
  pg1.endDraw(); 
}
void mousePressed() 
{
  t0 = random(20, 255);
  t1 = random(20, 255);
  println(t0,t1);
}

Can you help me?

Tagged:

Answers

Sign In or Register to comment.