Trouble In getting My shape to Bounce or change color appropriately while method is being used

edited November 2017 in Questions about Code
PShape star;                                                        
float red   = random(255);
float green = random(255);
float blue  = random(255);

int rad = 60;   //width of the shape
float xpos, ypos;

float xspeed = 5;
float yspeed = 5;

int xdirection = 1;
int ydirection = 1;

void setup() {
  size(1000, 1000, P2D);
  colorMode(RGB, 255);
  background(0);
  xpos = width/2;
  ypos = height/2;
  star = createShape();  // creating the star shape
  star.beginShape();
  star.fill(255, 255, 0);  // setting the default color of the star
  star.stroke(255);
  star.strokeWeight(2);
  star.vertex(0, -50);   // creating the  star shape 
  star.vertex(14, -20);
  star.vertex(47, -15);
  star.vertex(23, 7);
  star.vertex(29, 40);
  star.vertex(0, 25);
  star.vertex(-29, 40);
  star.vertex(-23, 7);
  star.vertex(-47, -15);
  star.vertex(-14, -20);
  star.endShape(CLOSE);
  shape(star, xpos, ypos);
  //shapeMode(RADIUS)             if this line of code is enabled the star is stuck in the corner and only changes color
}

void draw() {
}


void mousePressed() {                         // while mousepressed the star should change color and bounce around the screen


  xpos = xpos + (xspeed * xdirection);
  ypos = ypos + (yspeed * ydirection);


  if (xpos > width-rad || xpos < rad) {

    xdirection *= -1;
  }

  if (ypos > height-rad || ypos <rad) {

    ydirection *= -1;
  }

  background(0);
  shape(star, xpos, ypos);

  star.disableStyle();                           
  fill(red, green, blue);

  if (red<255)
    red = red+random(255);
  else
    red = 0;

  if (green < 255) 
    green = green+random(255);
  else
    green = 0;

  if (blue<255)
    blue = blue+random(255);
  else 
  blue = 0;
}

/*void mouseReleased() {           //when mouse is released repostion star in middle 
 star.enableStyle();                    // to original color
 background(0);
 shape(star, width/2, height/2);
 }
 */

I want the program to start with the yellow star in the middle and then when you press and hold down the mouse button it should begin bouncing around the screen while constantly changing colors? upon mouseReleased the star resets back to the middle. I'm pretty new to processing so I can't see where I'm going wrong.

When I take the bounce code out of the mousePressed method and place it in draw, the star just goes from the top left corner to the botom right and changes color upon each mouseclick any advice would be highly appreciated!

Answers

  • Answer ✓

    Try this.

    Kf

    PShape star;                                                        
    float red   = random(255);
    float green = random(255);
    float blue  = random(255);
    
    int rad = 60;   //width of the shape
    float xpos, ypos;
    
    float xspeed = 5;
    float yspeed = 5;
    
    int xdirection = 1;
    int ydirection = 1;
    
    void setup() {
      size(600, 400, P2D);
      colorMode(RGB, 255);
    }
    
    void draw() {
      background(0);
      if (!mousePressed) {
        xpos = width/2;
        ypos = height/2;
        initStar(color(255, 255, 0));
        shape(star, xpos, ypos);
      } else {
        xpos = xpos + (xspeed * xdirection);
        ypos = ypos + (yspeed * ydirection);
    
    
        if (xpos > width-rad || xpos < rad) {
          initStar(color(random(255), random(255), random(255)));
          xdirection *= -1;
        }
    
        if (ypos > height-rad || ypos <rad) {
          initStar(color(random(255), random(255), random(255)));
          ydirection *= -1;
        }
    
        background(0);
        shape(star, xpos, ypos);
      }
    }
    
    
    void initStar(color c) {
      star = createShape(); 
      star.beginShape();  
      star.fill(c);  // setting the default color of the star
      star.stroke(255);
      star.strokeWeight(2);
      star.vertex(0, -50);   // creating the  star shape 
      star.vertex(14, -20);
      star.vertex(47, -15);
      star.vertex(23, 7);
      star.vertex(29, 40);
      star.vertex(0, 25);
      star.vertex(-29, 40);
      star.vertex(-23, 7);
      star.vertex(-47, -15);
      star.vertex(-14, -20);
      star.endShape(CLOSE);
    }
    
  • hey thanks this is exactly what i had in mind! would you be able to explain why my original way of doing this was not working out??

  • Answer ✓

    You were doing things in an unconventional way. It is preferred to do all the animations inside draw. Also, I find your call tostar.disableStyle(); not desirable. I am not familiar with that call but I do know that if you want to change the color of the object, you will need to redraw it again. As you see in my code, I went a bit far as to re-creating the object as well so to get the desirable effect. Other than that, you had your code logic correct.

    Kf

  • ok I understand now, thanks! the star.disablestyle was a work around i found as I was getting an error telling me it expected an int and not a float when i was trying to change colors on the star originally. the way you did it works better and i can implement my own color change with it! thanks

Sign In or Register to comment.