Write a Button class (see Example 5-5 for a non-object-oriented button). The button class should register when a mouse is pressed over the button and change color. Create button objects of different sizes and locations using an array. Before writing the main program, sketch out the Button class. Assume the button is off when it first appears. Here is a code framework:
class Button {
// Button location and size
float x;
float y;
float w;
float h;
// Is the button on or off?
boolean on;
// Constructor initializes all variables
Button(float tempX, float tempY, float tempW, float tempH) {
x = tempX;
y = tempY;
w = tempW;
h = tempH;
on = false; // Button always starts as off
}
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
______________________________________________
}
// Learning Processing
// Daniel Shiffman
// http://www.learningprocessing.com
// Exercise 9-8: Write a Button class (see Example 5-5 for a non-object-oriented button). The button
// class should register when a mouse is pressed over the button and change color. Create button objects
// of different sizes and locations using an array. Before writing the main program, sketch out the
// Button class. Assume the button is off when it first appears.
// An array of buttons
Button[] buttons = new Button[6];
void setup() {
size(600,200);
smooth();
// A loop to evenly space out the buttons along the window
for (int i = 0; i < buttons.length; i++) {
buttons[i] = new Button(i*100+25,height/2-25,50,50);
}
}
void draw() {
background(255);
// Show all the buttons
for (int i = 0; i < buttons.length; i++) {
buttons[i].display();
}
}
void mousePressed() {
// When the mouse is pressed, we must check every single button
for (int i = 0; i < buttons.length; i++) {
buttons[i].click(mouseX,mouseY);
}
}
// Learning Processing
// Daniel Shiffman
// http://www.learningprocessing.com
// Exercise 9-8: Write a Button class (see Example 5-5 for a non-object-oriented button). The button
// class should register when a mouse is pressed over the button and change color. Create button objects
// of different sizes and locations using an array. Before writing the main program, sketch out the
// Button class. Assume the button is off when it first appears.
// Button class
class Button {
// Button location and size
float x;
float y;
float w;
float h;
// Is the button on or off?
boolean on;
// Constructor initializes all variables
Button(float tempX, float tempY, float tempW, float tempH) {
x = tempX;
y = tempY;
w = tempW;
h = tempH;
on = false; // Button always starts as off
}
void click(int mx, int my) {
// Check to see if a point is inside the rectangle
if (mx > x && mx < x + w && my > y && my < y + h) {
on = !on;
}
}
// Draw the rectangle
void display() {
rectMode(CORNER);
stroke(0);
// The color changes based on the state of the button
if (on) {
fill(175);
} else {
fill(0);
}
rect(x,y,w,h);
}
}









Hi!
Something weird happened here with my display function:
void display(){
rectMode(CORNER);
stroke(100);
rect(x,y,w,h); // when rect is here, the button that reacts is always the next button of the array…
if (on){
fill(175);
}else{
fill(0);
}
//rect(x,y,w,h); —-> when rect is here, the program works properly…
}
Is that any relation with the program flow, or is that a bug??
Comment by Maria Antônia — February 8, 2010 @ 11:44 am
That’s exactly right. fill() affects the shapes drawn afterwards so you always want to make sure you call rect() (or whatever shape you want) after you set the rectangle’s color.
Comment by Daniel Shiffman — February 8, 2010 @ 8:40 pm