Create a particle explosion of an image

CantSayIHave

Hey, I'd like to make an explosion effect for a game I'm making. The image is about 20 pixels w/h so I'm not looking for anything huge.

I'd like to make it radiate outwards and fade from a central point, but I can't think of how to.

Any help is appreciated.

Thanks

Chrisir

ok...

that's hard...

start by loading and displaying an image . Do you got that?

to do

since you want to move pixel separately:

look into particle systems

e.g. in shiffmans book http://natureofcode.com/book/chapter-4-particle-systems/

OOP

then have a class Particle and an Array particles consisting of objects of that class

then transfer each pixel to a particle (preserving position and color, and assigning speed and directions) - read out the image pixel by pixel and each time say something like particles[k] = new Particle(x,y,colorOfThatPixel, speedX,speedY);

then start the explosion by animating and drawing each particle in a for-loop

for (Particle currentParticle : particles) {
    currentParticle.animate();
    currentParticle.display();
}

post your code, then we can look into fading out

Chrisir

ArrayList<Ball> balls;

int rectWidth = 30;
int rectHeight = 30;

int beginPosition;
int stopPosition;

// -------------------------------------

void setup() {
  size(400, 800);

  frameRate(10);
  smooth();
  noStroke();

  // now start filling the ArrayList  

  beginPosition = 0;
  stopPosition = height-rectHeight/2;

  balls = new ArrayList();
  for (int i=0; i<random (12, 23); i++) {
    color colorTemp = color(random(0, 255), random(0, 255), random(0, 255));
    Ball newBall = new Ball( random(0, width), random(0, height), 
      rectWidth, rectHeight, 
      beginPosition, random(100), 
      colorTemp);  
    balls.add( newBall );
  } // for 
  //
} // func 

void draw() {
  background(255);

  // for-loop backward, because no reason 
  for (int i = balls.size()-1; i >= 0; i--) { 
    Ball ball = balls.get(i);
    ball.moveThis(); 
    ball.display();
  } // for 

  // for-loop backward, because we are removing items from the list
  for (int i = balls.size()-1; i >= 0; i--) { 
    Ball ball = balls.get(i);
    if (!ball.alive) 
      balls.remove(i);
  } // for 

  println(balls.size());
  fill(0);
  text("Add balls with mouse click. Balls disappear below.", 15, 15);
} // func 

// ------------------------------------------------------------

void mousePressed() {
  // add ball at mouse position
  color colorTemp = color(random(0, 255), random(0, 255), random(0, 255));
  balls.add(new Ball( mouseX, mouseY, 
    rectWidth, rectHeight, 
    beginPosition, random(100, 200), 
    colorTemp));
}

// ===========================================

class Ball {  
  // pos
  float x;
  float y;

  // size
  float w;
  float h;

  // movement 
  float beginPos;
  float stopPos;
  float speedX = random(-9, 9);
  float speedY = random(-9, 9);

  // color 
  color cBall;

  // ball still alive?
  boolean alive = true; 

  float k=0; // how old am I ?  

  Ball(float tempX, float tempY, 
    float tempW, float tempH, 
    float tempBegin, float tempStop, 
    color tempcBall) {
    x = tempX;
    y = tempY;
    w = tempW;
    h = tempH;
    //   beginPos = tempBegin; // not in use 
    stopPos = tempStop+y;      // only positive y values are checked 
    cBall=tempcBall;

    // we don't want any slow guys
    if (abs(speedX) < .9) 
      speedX = random(1, 6);
    if (abs(speedY) < .9) 
      speedY = random(1, 6);
  } // constr 

  void moveThis() {
    x = x + speedX; 
    y = y + speedY;
    if (y > stopPos) {
      y = stopPos;
      alive = false;
    }
    k+=1.5; // older
  } // method 

  void display() {
    fill(cBall, 100-k);
    if (k>=100) 
      alive=false; 
    ellipse (x, y, w, h);
  } // method 
  //
} // class
//