Image into shapes

General Discussion Other

pablodela..

in General Discussion • Other • 4 months ago

I need to fill an ellipse with a .jpg image. Is that even possible? because I can't find any example of that.

Thanks ^^

Replies(5)

tfguy44

Re: Image into shapes

4 months ago

PImage img = loadImage( "http://reesephoto.files.wordpress.com/2012/07/swallowtail-on-red-flowers.jpg" );
PGraphics pg;
void setup(){
size(600,400);
pg = createGraphics( width, height, P2D);
pg.beginDraw();
pg.background(0);
pg.noStroke();
pg.fill(255);
pg.smooth();
pg.ellipse(300,200,width-10,height-10);
pg.endDraw();
img.mask( pg.get() ); // This is the magic.
background(128,200,30);
image( img, 0, 0 );
noLoop();
}
void draw(){}

GoToLoop

Thank you both!!! but now i have another problem.How do i "undo" that mask for other images i wanna place???

Because now all the images i have they are in ellipse form, and i want 1 of them in rectangle form :P

Sorry about my english :S

tfguy44

Re: Image into shapes

4 months ago

The masking effect is only applied to the image you mask with it.
Post your code so we can see what you're doing wrong.

GoToLoop

Re: Image into shapes

4 months ago

Indeed, drawing upon main Processing's PGraphics surface is buggy if needs to create more than 1.

Here's a modified version using Pgraphics as tfguy44 's again:

// http://forum.processing.org/topic/image-into-shapes

final static String URL  = "http://reesephoto.files.wordpress.com/2012/07/";
final static String FILE = "swallowtail-on-red-flowers.jpg";

//final static String PATH = URL + FILE;
final static String PATH = FILE;

final static color  BG = #80A020;
final static float  SCALING = .9;

PImage imgEllipse, imgRect;
boolean toggle;

void setup() {
  size(600, 400);
  noLoop();

  final PImage img = loadImage(PATH);
  img.resize(width, height);

  imgEllipse = img.get();
  imgRect = img.get();

  final PGraphics pg = initSurface();

  pg.ellipse(width >> 1, height >> 1, width*SCALING, height*SCALING);
  imgEllipse.mask( pg.get() );

  pg.background(0);
  pg.rect(width >> 1, height >> 1, width*.5, height*.5);
  imgRect.mask( pg.get() );
}

void draw() {
  background(BG);
  image(toggle? imgEllipse:imgRect, 0, 0);
}

void mousePressed() {
  redraw();
  toggle = !toggle;
  println(toggle);
}

void keyPressed() {
  mousePressed();
}

PGraphics initSurface() {
  final PGraphics pg = createGraphics(width, height, JAVA2D);

  pg.beginDraw();
  pg.smooth();
  pg.noStroke();
  pg.fill(-1);
  pg.background(0);
  pg.ellipseMode(CENTER);
  pg.rectMode(CENTER);
  pg.endDraw();

  return pg;
}

Top Reply