I'm writing a processing sketch displaying multiple videos with 'transparent' background, by masking the RGB-layer with it's own Alpha layer, like this:
I rendered the two videos in Aftereffects. The 'rgbmovie' is a movie rendered normally with RGB-properties. The 'alphamovie' is the same movie, but only rendered with ALPHA-properties. This enables me to mask() the RGB movie with its ALPHA movie, and create a movie with transparent background in Processing.
This works fine in theory, but I have problems syncing up the RGB with the ALPHA movie. When I run my sketch it looks like this. The cirlces should be filled with colour of the RGB layer, but they are cropped instead.
This is my code supposedly displaying two 'transparent' videos, each by masking the RGB-movie with the ALPHA-movie. The first movie gets displayed when pressing the 'A'-button, the other one by pressing 'W'.
Has anyone an idea what I'm doing wrong or how to fix that problem?
- rgbmovie.mask(alphamovie);
image(rgbmovie, width/2, height/2);
I rendered the two videos in Aftereffects. The 'rgbmovie' is a movie rendered normally with RGB-properties. The 'alphamovie' is the same movie, but only rendered with ALPHA-properties. This enables me to mask() the RGB movie with its ALPHA movie, and create a movie with transparent background in Processing.
This works fine in theory, but I have problems syncing up the RGB with the ALPHA movie. When I run my sketch it looks like this. The cirlces should be filled with colour of the RGB layer, but they are cropped instead.
This is my code supposedly displaying two 'transparent' videos, each by masking the RGB-movie with the ALPHA-movie. The first movie gets displayed when pressing the 'A'-button, the other one by pressing 'W'.
- int air, water;
import processing.video.*;
Movie elair, elair_mask, elwater, elwater_mask;
void setup() {
size(600, 400, JAVA2D);
frameRate(30);
elair = new Movie(this, "air.mov");
elair_mask = new Movie(this, "air_alpha.mov");
elwater = new Movie(this, "water.mov");
elwater_mask = new Movie(this, "water_alpha.mov");
imageMode(CENTER);
int air, water = 0;
}
void draw() {
background(200);
//+WATER PARTICLES
if (water == 1) {
elwater_mask.read();
elwater.read();
elwater.loop();
elwater_mask.loop();
elwater.play();
elwater_mask.play();
elwater.mask(elwater_mask);
image(elwater, width/2, height/2);
} else {
elwater.stop();
elwater_mask.stop();
}
//+AIR PARTICLES
if (air == 1) {
elair_mask.read();
elair.read();
elair.loop();
elair_mask.loop();
elair.play();
elair_mask.play();
elair.mask(elair_mask);
image(elair, width/2, height/2);
} else {
elair.stop();
elair_mask.stop();
}
}
void keyPressed(){
if(key == 'a') {air = 1;}
if(key == 'w') {water = 1;}
}
void keyReleased(){
if(key == 'a') {air = 0;}
if(key == 'w') {water = 0;}
}
Has anyone an idea what I'm doing wrong or how to fix that problem?