Setting transparency with pixels[]

Processing Coding Questions
1

Hello,

i have a sketch where i’m trying to set a certain color of an image to zero transparency color(0,0).

It works in the first part of the sketch but for some reason doesn’t work in the second part.

See image for reference.

> Image <

Here’s the whole code:

import org.openkinect.processing.*;

// Kinect Library object
Kinect2 kinect2;

float minThresh = 1000;
float maxThresh = 2700;
PImage img, img1, img3;
int counter;
boolean img3Draw = false;
PImage hintergrund;
int timer = 0;
boolean firstClick = true;

void setup() {
  frameRate(30);
  background(0);
  hintergrund = loadImage("hintergrund3.png");

  size(1920, 1080);
  kinect2 = new Kinect2(this);
  kinect2.initDepth();
  kinect2.initDevice();
  img = createImage(kinect2.depthWidth, kinect2.depthHeight, ARGB);
  img3 = createImage(kinect2.depthWidth, kinect2.depthHeight, ARGB);
}


void draw() {
  image(hintergrund, 0, 0);

  img.loadPixels();

  int[] depth = kinect2.getRawDepth();

  float totalPixels = 0;

  for (int x = 0; x < kinect2.depthWidth; x++) {
    for (int y = 0; y < kinect2.depthHeight; y++) {
      int offset = x + y * kinect2.depthWidth;
      int d = depth[offset];

      if (d > minThresh && d < maxThresh && x > 100) {
        img.set(x, y, color(map(depth[offset], 4500, 500, 0, 255)));

        totalPixels++;
      } else {
        img.pixels[offset] = color(0,0);
      }
    }
  }


  counter++;
  if (counter == 5) {
    pushStyle();
    tint(255, 3);
    image(img, 100, 500);
    popStyle();
    counter = 0;
  }


  
  timer++;
  if (timer == 100) {
  }

  println(img3Draw);

  if (img3Draw == true) { 

    image(img3, 400, 100, kinect2.depthWidth, kinect2.depthHeight);
  }
}


void mouseClicked() {

  img3 = get(100, 500, 512, 424);
  img3.loadPixels();

  for (int x=0; x< img3.pixels.length; x++) {
    if (img3.pixels[x] == color(0)) {
      img3.pixels[x] = color(0, 0);
    }
  }
  img3.updatePixels();
  img3Draw = true;
}

I can set the pixels to a different color like this:

  for (int x=0; x< img3.pixels.length; x++) {
    if (img3.pixels[x] == color(0)) {
      img3.pixels[x] = color(0, 255, 0);
    }
  }

But when i try to set them to transparent with color(0,0); the black pixels seem to stay black.

Thank you in advance!

2

Maybe it’s caused by :

if (img3.pixels[x] == color(0))

Is the img3 pixels are black?

3

The img3 does contain a lot of black pixels, and i can change them if i change them to a differen color like this:

for (int x=0; x< img3.pixels.length; x++) {
    if (img3.pixels[x] == color(0)) {
      img3.pixels[x] = color(0, 255, 0);
    }
  }

In this example i tried to set the new colors to green, which works in the sketch, so the code itself does work.

Only when i try to use color(0,0) it does not work anymore, and the pixels simply seem to stay black:

for (int x=0; x< img3.pixels.length; x++) {
    if (img3.pixels[x] == color(0)) {
      img3.pixels[x] = color(0, 0);
    }
  }
4

Could you just post a screenshot of the window?

5
6

@josephh

[Album] Imgur

7

But the pixels behind the img3 image are black aren’t they? So if you change the opacity of black pixels of img3 to 0, you should see black pixels behind.

Tell me if I’m wrong

8

@josephh

  img3.loadPixels();

  for (int x=0; x< img3.pixels.length; x++) {
    if (img3.pixels[x] == color(0)) {
      img3.pixels[x] = color(0, 0);
    }
  }
  img3.updatePixels();

The pixels behind img3 are black. I’m trying to set the opacity of the black pixels to 0 with color(0,0), but it is not working as well.

9

Well it seems that you can’t make a pixel of a PImage transparent :

PImage img;

void setup() {
  size (640, 480);
  
  img = createImage(width/2,height/2,RGB);
  
  img.loadPixels();
  for(int i=0;i<img.pixels.length;i++){
    img.pixels[i] = color(0,0);
    println(alpha(img.pixels[i]));
  }
}

void draw() {
  background(0,255,0);
  image(img,0,0);
}

The result :

Capturenn
Capturenn.PNG666×540 5.75 KB

It’s strange because the alpha value of each pixel is 0.

10

Make that ARGB and works fine here! RGB makes it ignore the alpha value.

11

My bad, thanks for the answer ! :slight_smile:

12

I did use ARGB when setting up the createImage() in the setup(). :confused:

13

Finally I don’t understand your problem because you wrote :

img3 = createImage(kinect2.depthWidth, kinect2.depthHeight, ARGB); with “ARGB”

14

Maybe

img3 = get(100, 500, 512, 424);

saves the frame as a normal RGB image somehow even though i created the image as ARGB?

1 Like
15

I think that’s your problem - get() returns a new PImage which in this case will be RGB like the primary surface.

2 Likes
16

Is it possible to have get() return an ARGB image?

Or what would this line

img3 = get(100, 500, 512, 424);

look like if i tried to use a double for() and pixels?

Something like this?

 for (int x = 100; x < 500; x++) {
    for (int y = 580; y < 1080; y++) {
      loadPixels();
      for (int p=0; p < pixels.length; x++) {
      img3.set(x, y, pixels[]);
      }
    }
  }

At the moment i would like to focus on getting the sketch to run, so i can worry about performance later. :smiley:

17

Class PImage got a public field called format, in which we can assign constant ARGB to it: :robot:

2 Likes
18

How do i change this? The PImage.java is not included in the processing download by default? Do i need to create a new folder?

And just change it like this?

IuysO54.png508×525 30.9 KB

(I pasted the code into processing for better formatting)

19

No, like this: img3.format = ARGB in your original Processing sketch.

1 Like
20

Thank you everyone, that fixed it!