Processing mirror image over x axis?

问题

I was able to copy the image to the location but not able to mirror it. what am i missing?

PImage img; 
float srcY;
float srcX;
int destX;
int destY;

img = loadImage("http://oldpalmgolfclub.com/wp-content/uploads/2012/02/Palm- Beach-State-College2-e1329949470871.jpg");

size(img.width, img.height * 2);

image(img, 0, 0);
image(img, 0, 330);

int num_pixels = img.width * img.height;

int copiedWidth = 319 - 254;
int copiedHeight = 85 - 22;
int startX = (width / 2) - (copiedWidth / 2);
int startY = (height / 2) - (copiedHeight / 2);

回答1:

How about simply scaling by -1 on the x axis ?

PImage img; 

img = loadImage("https://processing.org/img/processing-web.png");

size(img.width, img.height * 2);

image(img,0,0);
scale(-1,1);//flip on X axis
image(img,-img.width,img.height);//draw offset

This can be achieved by manipulating pixels as well, but needs a bit of arithmetic:

PImage img; 

img = loadImage("https://processing.org/img/processing-web.png");
size(img.width, img.height * 2);

int t = millis();

PImage flipped = createImage(img.width,img.height,RGB);//create a new image with the same dimensions
for(int i = 0 ; i < flipped.pixels.length; i++){       //loop through each pixel
  int srcX = i % flipped.width;                        //calculate source(original) x position
  int dstX = flipped.width-srcX-1;                     //calculate destination(flipped) x position = (maximum-x-1)
  int y    = i / flipped.width;                        //calculate y coordinate
  flipped.pixels[y*flipped.width+dstX] = img.pixels[i];//write the destination(x flipped) pixel based on the current pixel  
}
//y*width+x is to convert from x,y to pixel array index
flipped.updatePixels()
println("done in " + (millis()-t) + "ms");

image(img,0,0);
image(flipped,0,img.height);

The above can be achieved using get() and set(), but using the pixels[] array is faster. A single for loop is generally faster than using 2 nested for loops to traverse the image with x,y counters:

PImage img; 

img = loadImage("https://processing.org/img/processing-web.png");
size(img.width, img.height * 2);

int t = millis();
PImage flipped = createImage(img.width,img.height,RGB);//create a new image with the same dimensions
for(int y = 0; y < img.height; y++){
  for(int x = 0; x < img.width; x++){
    flipped.set(img.width-x-1,y,img.get(x,y));
  }
}
println("done in " + (millis()-t) + "ms");

image(img,0,0);
image(flipped,0,img.height);

You can copy a 1px 'slice'/column in a single for loop and which is faster(but still not as fast as direct pixel manipulation):

PImage img; 

img = loadImage("https://processing.org/img/processing-web.png");
size(img.width, img.height * 2);

int t = millis();

PImage flipped = createImage(img.width,img.height,RGB);//create a new image with the same dimensions
for(int x = 0 ; x < flipped.width; x++){               //loop through each columns
  flipped.set(flipped.width-x-1,0,img.get(x,0,1,img.height));       //copy a column in reverse x order
}

println("done in " + (millis()-t) + "ms");

image(img,0,0);
image(flipped,0,img.height);

There are other alternatives like accessing the java BufferedImage (although this means the Processing sketch will work in Java Mode mostly) or using a PShader, but these approaches are more complex. It's generally a good idea to keep things simple (especially when getting started).

来源：https://stackoverflow.com/questions/29334348/processing-mirror-image-over-x-axis

标签

image

processing

mirroring