Help on mirroring an image

#1

So I am currently doing some school assignments which involves me mirroring an image “pixel by pixel”. I got an example on how to flip the image, however i’m struggling to figure out how to mirror it.

Here is the code that I used to flip the image

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

int i = 0; { 

while (i < img.pixels.length) { 
  tempArray[i] = img.pixels[i];
  i++;
}

int j = 0;
while (j < img.pixels.length) {
  img.pixels[j] = tempArray[img.pixels.length-1-j];
  j++;
}

Any help and explanations on all of this would be greatly appreciated, thanks!

0 Likes

#2

-a- pls format your code using the

</>

code format tool.

-b- the code part you show can not run, if we would like to test
any idea of change, we would have to write all again.

-c- what is the problem

  • does the code not run?
  • does the copy image show but what?

-d- looks like you try to read the pixels backward
depending how you want to mirror it might be wrong,
check on how the pixel data in that array are organized.
you might need to read backward, but line by line!

0 Likes

#3

I think you want to connvert color arrays like this:

[0][1][2] > [2][1][0]
[3][4][5] > [5][4][3]
[6][7][8] > [8][7][6]

then, you should set your temporal arrays like this:

PImage img=loadImage("img.jpg");
color[] tempArray = new color[img.pixels.length];
int i = 0;
while (i < img.pixels.length) {
  tempArray[i] = img.pixels[i-i%img.width+(img.width-1)-i%img.width];
  i++;
}
i=0;
while (i < img.pixels.length) {
  img.pixels[i] = tempArray[i];
  i++;
}
size(683,592);
image(img,0,0);
2 Likes

#4

also possible to use the get set method
starting from the example

/Basics/Image/LoadDisplayImage

/* Load and Display example */
PImage img, mirror;  // Declare variable of type PImage
boolean showorg = false;

void setup() {
  size(640, 360);
  img = loadImage("data/moonwalk.jpg");                      // Load the image file into the program  
  mirror = createImage(img.width/2, img.height, ARGB);       // make a empty image half size            
  for (int y = 0; y < img.height; y++) {
    for (int x = img.width/2; x < img.width; x++) {          // take the right half only
      mirror.set(img.width-x-1, y, img.get(x, y));           // and set mirror position
    }
  }
}

void draw() {
  background(200,200,0);
  if ( showorg) image(img, 0, 0);                                          // show original
  image(mirror, 0, 0);                                       // paint mirror over it
}

void keyPressed() {
  if ( key == 'o' ) showorg = ! showorg; 
}

1 Like

#5

i know it’s for school but you might as well see a few varieties. AngelsApple’s example is of switching the numbers is great for figuring out the method to this madness. anyways some pseudo for the road. EDIT: maybe i misinterpreted what you wanted i’ll leave this here anyways.

		var imgWidthHalf = srcImg.width / 2,
			imgHeightHalf = srcImg.height / 2,
			x = 0,
			y = 0,
			xy1 = 0,
			xy2 = 0,
			red = 0,
			green = 0,
			blue = 0,
			alpha = 0;
		
		//flip vertically
		for(y = 0; y < imgHeightHalf; y++) {
			for(x = 0; x < srcImg.width; x++) {
				xy1 = (x + y * srcImg.width) * 4;
				xy2 = (x + (srcImg.height - 1 - y) * srcImg.width) * 4;
				
				red = pixels[xy1];
				green = pixels[xy1 + 1];
				blue = pixels[xy1 + 2];
				alpha = pixels[xy1 + 3];
				
				pixels[xy1] = pixels[xy2];
				pixels[xy1 + 1] = pixels[xy2 + 1];
				pixels[xy1 + 2] = pixels[xy2 + 2];
				pixels[xy1 + 3] = pixels[xy2 + 3];
				
				pixels[xy2] = red;
				pixels[xy2 + 1] = green;
				pixels[xy2 + 2] = blue;
				pixels[xy2 + 3] = alpha;
			}
		}
		
		//horizontally
		for(y = 0; y < srcImg.height; y++) {
			for(x = 0; x < imgWidthHalf; x++) {
				xy1 = (x + y * srcImg.width) * 4;
				xy2 = ((srcImg.width - 1 - x) + y * srcImg.width) * 4;
				
				red = pixels[xy1];
				green = pixels[xy1 + 1];
				blue = pixels[xy1 + 2];
				alpha = pixels[xy1 + 3];
				
				pixels[xy1] = pixels[xy2];
				pixels[xy1 + 1] = pixels[xy2 + 1];
				pixels[xy1 + 2] = pixels[xy2 + 2];
				pixels[xy1 + 3] = pixels[xy2 + 3];
				
				pixels[xy2] = red;
				pixels[xy2 + 1] = green;
				pixels[xy2 + 2] = blue;
				pixels[xy2 + 3] = alpha;
			}
		}
0 Likes