Draw a blue rectangle

angelfire101

Write a program that allows the user to click in 2 locations to draw a blue rectangle (where the 2 points you clicked on serve as the opposite diagonal corners)

asimes

This forum is not for handing out code. Explain why you are stuck writing this yourself and post your efforts so far. Someone will help you from there

Imagine first the easiest case which is where the user clicks the top-left corner and then the bottom-right corner. The x, y position of the rect() would just be where mouseX, mouseY was during the first click. During the second mouse click the width would be the new mouseX position minus the position of the first mouseX (finding height is similar with mouseY)

GoToLoop

http://forum.processing.org/two/discussion/10700/drawing-rectangles

angelfire101

Can someone just give me the code I've been struggling with this for 30 minutes like honestly I don't get it like I put the mouse x and mouse y for the rectangle but do I have to write mousepressed first like how is a rectangle even drawn from clicking on two points

asimes

No, it is pretty clear that this is an assignment and you need to do it yourself. We can give you starting code and help you out with specific questions

Below I made some starting code. There are a few important things going on:

• The mousePressed() function code gets executed when someone clicks the mouse

• Inside of the mousePressed() function a variable named clickNumber keeps track of what click is currently happening. I just made this up by adding 1 to a variable each time a click happens

• During the first click and the second click the corresponding mouseX and mouseY are stored for later use (inside x1, y1, x2, and y2)

What you need to do is draw a rect() based on x1, y1, x2, and y2. Do the case I mentioned above first, it is the easier case to handle. Basically the rect() will be placed at location x1, y1 and the width and height will have to be calculated by finding the difference of x2-x1 and y2-y1

// We are going to store the clicks in these integers
int x1, y1, x2, y2;

// We are going to keep track of what click happened with this
// I didn't need to make clickNumber 0 because it is by default
// but it important that it is 0 at first so I am showing it
int clickNumber = 0;

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

void draw() {
  background(255, 255, 255);

  // This is just to help you visually
  // It draws a circle at the first click and the second click
  ellipse(x1, y1, 10, 10);
  ellipse(x2, y2, 10, 10);

  // If at least 2 clicks have happened you will have to draw the rectangle
  // Try working on the easier case I mentioned earlier in the comments first
  if (clickNumber >= 2) {
    // Code for drawing the rect() goes here
  }
}

void mousePressed() {
  // Every time a click happens we will make clickNumber one bigger
  // We only care about the first click and the second click
  clickNumber++;

  // Store the first click with x1, y1
  if (clickNumber == 1) {
    x1 = mouseX;
    y1 = mouseY;
  }

  // Store the second click with x2, y2
  if (clickNumber == 2) {
    x2 = mouseX;
    y2 = mouseY;
  }

  // No need to store other clicks in this sketch
}

quark

Can someone just give me the code I've been struggling with this for 30 minutes

So you want to cheat on your homework? Well we are not hear to help you cheat.

Discussion closed.