Make a still image from an array of pixels

Programming Questions

marginale

Make a still image from an array of pixels

in Programming Questions • 6 months ago

Hello to all,

I am new to processing. I want to do a project using the pixels of a still image but I am so confused! :)

First, here's what I want to do :

1- Load the image (quite easy!)

2- Store all its pixels in an array (ex: [0] 156, [1] 157, [2] 158 ...)

3- Inverse the array (ex: [0] 158, [1] 157, [2] 156 ...)

4- Display the result (and save it as a .tif file)

I based the code on examples from the processing website and the forum.

I also used a few println to see what was going on.

I think steps 2-3 were successful as the array is filled by a proper number of index and values (extremely weird values though since I was unable to convert them into rgb).

Step 4 is however a disaster... How may I assemble an image from an array of pixels?

I played with createImage but I failed... what am I missing?

Thanks for the help and ideas!

Here is the code:

PImage img;

color [] imageColors;

boolean test = false;

String fileName = "parr1_final.tif";

void setup() {

size(504, 360);

img = loadImage( "test1parr.jpg");

image(img,0,0);

img.loadPixels();

imageColors = new color[img.pixels.length];

for (int x=0; x < img.width; x++) { // search each line and row of the image

for (int y=0; y < img.height; y++) {

int loc = x + y*img.width;

float r = red (img.pixels [loc]);

float g = green (img.pixels [loc]);

float b = blue (img.pixels [loc]);

imageColors[loc] = color(r, g, b);

}

println(imageColors);

test = true;

if (test) {

//println("true");

for(int i = 0; i < imageColors.length/2; i ++) { // reverse the array

int temp = imageColors[i];

imageColors[i] = imageColors[imageColors.length - i - 1];

imageColors[imageColors.length - i - 1] = temp;

}

img.updatePixels();

println(imageColors);

img.save(fileName);

}

void draw() {

}

Replies(6)

tfguy44

Re: Make a still image from an array of pixels

6 months ago

PImage img; // This is the image.
img = loadImage( "test1parr.jpg" ); // Load the image.
size( img.width, img.height); // Make the sketch big enough to display the image.
img.loadPixels(); // Now you have access to img.pixels, which is an array of all the pixels in the image. This example doesn't make use of access to this array, however.
translate( width, height ); // Where are we going with this..?
rotate( PI ); // Ah ha! Convince yourself that these two operations have the same effect as "reversing" the array of pixels!
image( img, 0, 0 ); // Draw the image.
saveFrame( "Inverted.tif" ); // Save the "inverted" image.

marginale

Re: Re: Make a still image from an array of pixels

6 months ago

Ah ah, thanks but I already knew I could have the same result by a rotation. :)

Maybe my post is unclear. I made this project to learn how to play with pixels and fill arrays. With the code I submitted, why can't I see the rotation? What am I missing to display the image? I think I was able to fill the arrays but I certainly missed a few steps...

amnon.owed

Re: Make a still image from an array of pixels

6 months ago

When you load an image, the pixels are already available in an array. You can operate on this array directly. And you can reverse it with a single line (see the code example below). Once you've reversed it, then displaying and saving is done as usual.

Code Example

PImage img = loadImage("http://anngardnerphotography.com/stock/hawaii/ridged_landscape.jpg"); // load
size(img.width, img.height); // sketch size
img.pixels = reverse(img.pixels); // reverse
image(img, 0, 0); // display
save("output.tif"); // save

marginale

Re: Re: Make a still image from an array of pixels

6 months ago

One last question then :

Let's say I have an array of pixels that I have shuffled (to do something more complicated than a rotation lol), do I have to use createImage to reassemble all the pixels into an image?

That's probably where I am confused...

PhiLho

Re: Make a still image from an array of pixels

6 months ago

As said, the pixels array are already part of an image. In theory, you have to use loadPixels() to internally convert the image to its array of pixels, but in Java mode, it isn't necessary for PImage (but necessary for a PGraphics). I think it can be necessary, though, in other modes (Android, among others). updatePixels() is then needed to convert back the modified array of pixels to an image.

marginale

Re: Make a still image from an array of pixels

6 months ago

Great! Thanks

Top Reply