Mouse Press Redraw Loop

Thanks for taking the time to look at this, I am a beginner working on a racing game for a final project.
My goal is to have the race start after a mouse or key press I was able to achieve this but my object jumps to the very last step. I was able to get them moving while showing every step of the way without a mousePress() action but when I attempt to incorporate this it jumps straight to the end of the race rather then showing iterations in-between.

//This Program Was Designed To Make 2 Shapes Race
float circle = 0;
float circle2 = 0;

void setup() {
  size(640, 480);//sets the size
  ellipseMode(CENTER);
  rectMode(CENTER);
  
}

void draw() 
{
  background(255);                                            //sets background
  fill(255, 0, 0);                                            //color circle 1
  ellipse(circle, 195, 40, 40);                                //draw circle 1
  fill(0, 255, 0);                                              //color circle 2
  ellipse(circle2, 240, 40, 40);                              //draw circle 2
  if (mousePressed)
  {
    while (((circle+20) < width) && ((circle2 + 20) < width))
    {
      circle = circle +random(0, 5);
      circle2 = circle2 +random(0, 5);
      fill(255, 0, 0);                                          //color circle 1
      ellipse(circle, 195, 40, 40);                              //draw circle 1
      fill(0, 255, 0);                                            //color circle 2
      ellipse(circle2, 240, 40, 40);                              //draw circle 2
    }
  }
}
1 Like

Get rid of the while loop: draw() updates the screen only once at its end and not throughout.

Instead use the fact that draw() in itself loops 60 times per second

Also set a boolean variable to true once the mouse is pressed. Evaluate it to check if you move your players

1 Like

How your are explaining it is how I originally understood it but the issue I was left with was having to hold my mouse click down for the entirety of the race. I am guessing that this has something to do with my go variable.

//This Program Animates A Shape and makes Them race to the edge of screen
float circle = 0; //startX 1
float circle2 = 0;//startX 2
boolean go = false;//has mouse been clicked
void setup() {
  size(640, 480);
  frameRate(60);
}

void draw()
{
  background(255);//background color
  ellipseMode(CENTER);
  rectMode(CENTER);
  fill(255, 0, 0);//color player 1
  ellipse(circle, 220, 40, 40);//draw our first player
  fill(0, 255, 0);//color player 2
  ellipse(circle2, 240, 40, 40);//draw player 2
  if (mousePressed == true)//check to see if the race needs to begin
  {
    go = true;//set the race to begin
    if (go = true && circle < width && circle2 < width) //run race & check for screen edge finish
    {
      circle = circle + +random(0, 4);//make player 1 move
      circle2 = circle2 +random(0, 4);//make player 2 move
      fill(255, 0, 0);//color player 1
      ellipse(circle, 220, 40, 40);
      fill(0, 255, 0);
      ellipse(circle2, 240, 40, 40);
    }
  }
}

you had the two ifs within each other

separate them (first if sets go to true, second if evaluates go):


//This Program Animates A Shape and makes Them race to the edge of screen

float circle = 0; //startX 1
float circle2 = 0;//startX 2

boolean go = false;//has mouse been clicked?

void setup() {
  size(640, 480);
  frameRate(60);
}

void draw()
{
  background(255);//background color
  ellipseMode(CENTER);
  rectMode(CENTER);
  fill(255, 0, 0);//color player 1
  ellipse(circle, 220, 40, 40);//draw our first player
  fill(0, 255, 0);//color player 2
  ellipse(circle2, 240, 40, 40);//draw player 2

  if (mousePressed)//check to see if the race needs to begin
  {
    go = true;//set the race to begin
  } // end of if !!!!!!!!!!!!!!!!!!!!!!!!!!!

  // 

  if (go && circle < width && circle2 < width)
  {
    //run race & check for screen edge finish
    circle = circle + +random(0, 4);//make player 1 move
    circle2 = circle2 +random(0, 4);//make player 2 move
    fill(255, 0, 0);//color player 1
    ellipse(circle, 220, 40, 40);
    fill(0, 255, 0);
    ellipse(circle2, 240, 40, 40);
  }
}
//
1 Like

is the same as if (mousePressed == true)


Also, if (go = true) is very wrong, you want if (go == true) with two ==

2 Likes

besides, you draw the circles twice

correct:


//This Program Animates A Shape and makes Them race to the edge of screen

float circle = 0; //startX 1
float circle2 = 0;//startX 2

boolean go = false;//has mouse been clicked?

void setup() {
  size(640, 480);
  // frameRate(60);
  ellipseMode(CENTER);
  rectMode(CENTER);
}

void draw() {
  background(255);//background color

  fill(255, 0, 0);//color player 1
  ellipse(circle, 220, 40, 40);//draw our first player
  fill(0, 255, 0);//color player 2
  ellipse(circle2, 240, 40, 40);//draw player 2

  if (mousePressed) { //check to see if the race needs to begin
    go = true;//set the race to begin
  } // end of if !!!!!!!!!!!!!!!!!!!!!!!!!!!

  if (go && circle < width && circle2 < width) {
    //run race & check for screen edge finish
    circle = circle + +random(0, 4);//make player 1 move
    circle2 = circle2 +random(0, 4);//make player 2 move
  } // end of if
}// function
//
1 Like