clearing screen( can't get background(); to work as i want it to)
in
Programming Questions
•
10 months ago
My code is 3 buttons, which i'm gonna use in a music player for a school project.
When i run it, it's all good, but then when i press the play / pause button the "play arrow" stays there, and the "pause sign" is getting drawed under/over the "play Arrow".
I've tried putting the background(); function in different places, but it just keeps showing the "play arrow" whenever i click on the play/pause button.
Sorry if it seems confusing, i'm still new to processing.
please help! :)
Variables ---->
Setup and Draw ---->
FineAssButtonCircle FineAssButtonCirclePlayPause1;
FineAssButtonCircle FineAssButtonCirclePlayPause2;
FineAssButtonCircle FineAssButtonCirclePlayPause3;
FineAssButtonCircle FineAssButtonCirclePlayPause4;
FineAssButtonCircle FineAssButtonCirclePlayPause5;
FineAssButtonCircle FineAssButtonCirclePlayPause6;
FineAssButtonCircle FineAssButtonCirclePlayPause7;
FineAssButtonCircle FineAssButtonCirclePrevious1;
FineAssButtonCircle FineAssButtonCirclePrevious2;
FineAssButtonCircle FineAssButtonCirclePrevious3;
FineAssButtonCircle FineAssButtonCirclePrevious4;
FineAssButtonCircle FineAssButtonCirclePrevious5;
FineAssButtonCircle FineAssButtonCircleNext1;
FineAssButtonCircle FineAssButtonCircleNext2;
FineAssButtonCircle FineAssButtonCircleNext3;
FineAssButtonCircle FineAssButtonCircleNext4;
FineAssButtonCircle FineAssButtonCircleNext5;
FineAssButtonTriangle FineAssButtonTrianglePlayPause1;
FineAssButtonTriangle FineAssButtonTriangleNext1;
FineAssButtonTriangle FineAssButtonTriangleNext2;
FineAssButtonTriangle FineAssButtonTrianglePrevious1;
FineAssButtonTriangle FineAssButtonTrianglePrevious2;
FineAssButtonRectangle FineAssButtonRectanglePlayPause1;
FineAssButtonRectangle FineAssButtonRectanglePlayPause2;
void setup() {
size(500, 500);
smooth();
background(255);
FineAssButtonCirclePlayPause1 = new FineAssButtonCircle(color(25, 25, 25), 250, 250, 100, 100);
FineAssButtonCirclePlayPause2 = new FineAssButtonCircle(color(50, 50, 50), 250, 250, 85, 85);
FineAssButtonCirclePlayPause3 = new FineAssButtonCircle(color(75, 75, 75), 250, 250, 70, 70);
FineAssButtonCirclePlayPause4 = new FineAssButtonCircle(color(100, 100, 100), 250, 250, 55, 55);
FineAssButtonCirclePlayPause5 = new FineAssButtonCircle(color(125, 125, 125), 250, 250, 40, 40);
FineAssButtonCirclePlayPause6 = new FineAssButtonCircle(color(150, 150, 150), 250, 250, 25, 25);
FineAssButtonCirclePlayPause7 = new FineAssButtonCircle(color(175, 175, 175), 250, 250, 10, 10);
FineAssButtonCirclePrevious1 = new FineAssButtonCircle(color(25, 25, 25), 150, 250, 75, 75);
FineAssButtonCirclePrevious2 = new FineAssButtonCircle(color(50, 50, 50), 150, 250, 60, 60);
FineAssButtonCirclePrevious3 = new FineAssButtonCircle(color(75, 75, 75), 150, 250, 45, 45);
FineAssButtonCirclePrevious4 = new FineAssButtonCircle(color(100, 100, 100), 150, 250, 30, 30);
FineAssButtonCirclePrevious5 = new FineAssButtonCircle(color(125, 125, 125), 150, 250, 15, 15);
FineAssButtonCircleNext1 = new FineAssButtonCircle(color(25, 25, 25), 350, 250, 75, 75);
FineAssButtonCircleNext2 = new FineAssButtonCircle(color(50, 50, 50), 350, 250, 60, 60);
FineAssButtonCircleNext3 = new FineAssButtonCircle(color(75, 75, 75), 350, 250, 45, 45);
FineAssButtonCircleNext4 = new FineAssButtonCircle(color(100, 100, 100), 350, 250, 30, 30);
FineAssButtonCircleNext5 = new FineAssButtonCircle(color(125, 125, 125), 350, 250, 15, 15);
FineAssButtonTrianglePlayPause1 = new FineAssButtonTriangle(color(255, 255, 255), 235, 230, 275, 250, 235, 270);
FineAssButtonTriangleNext1 = new FineAssButtonTriangle(color(255, 255, 255), 355, 235, 385, 250, 355, 265);
FineAssButtonTriangleNext2 = new FineAssButtonTriangle(color(255, 255, 255), 325, 235, 355, 250, 325, 265);
FineAssButtonTrianglePrevious1 = new FineAssButtonTriangle(color(255, 255, 255), 180, 235, 150, 250, 180, 265);
FineAssButtonTrianglePrevious2 = new FineAssButtonTriangle(color(255, 255, 255), 150, 235, 120, 250, 150, 265);
FineAssButtonRectanglePlayPause1 = new FineAssButtonRectangle(color(255, 255, 255), 235, 235, 10, 30, 7);
FineAssButtonRectanglePlayPause2 = new FineAssButtonRectangle(color(255, 255, 255), 255, 235, 10, 30, 7);
}
void draw() {
background(255);
// Draws the play / Pause button.
FineAssButtonCirclePlayPause1.Run();
FineAssButtonCirclePlayPause2.Run();
FineAssButtonCirclePlayPause3.Run();
FineAssButtonCirclePlayPause4.Run();
FineAssButtonCirclePlayPause5.Run();
FineAssButtonCirclePlayPause6.Run();
FineAssButtonCirclePlayPause7.Run();
// Draws the Previous Song Button.
FineAssButtonCirclePrevious1.Run();
FineAssButtonCirclePrevious2.Run();
FineAssButtonCirclePrevious3.Run();
FineAssButtonCirclePrevious4.Run();
FineAssButtonCirclePrevious5.Run();
// Draws the Next Song Button.
FineAssButtonCircleNext1.Run();
FineAssButtonCircleNext2.Run();
FineAssButtonCircleNext3.Run();
FineAssButtonCircleNext4.Run();
FineAssButtonCircleNext5.Run();
// Draws the Arrows inside the Previous Song Button.
FineAssButtonTrianglePrevious1.Run();
FineAssButtonTrianglePrevious2.Run();
// Draws the Arrows inside the Next Song Button.
FineAssButtonTriangleNext1.Run();
FineAssButtonTriangleNext2.Run();
// Draws the "Play Arrow" inside the Play / Pause Button.
if (Playing == false) {
FineAssButtonTrianglePlayPause1.Run();
}
// Draws the Pause sign inside the Play / Pause Button.
if (Playing == true) {
FineAssButtonRectanglePlayPause1.Run();
FineAssButtonRectanglePlayPause2.Run();
}
// Changes the color of the Play / Pause buttons circles when pressing down the mouse on it.
if (mousePressed && (mouseButton == LEFT)) {
if ( FineAssButtonCirclePlayPause1.width1/2 >= sqrt( sq( FineAssButtonCirclePlayPause1.xpos1 - mouseX) + sq( FineAssButtonCirclePlayPause1.ypos1 - mouseY))) {
FineAssButtonCirclePlayPause1.c = color(95, 95, 95);
FineAssButtonCirclePlayPause2.c = color(80, 80, 80);
FineAssButtonCirclePlayPause3.c = color(60, 60, 60);
FineAssButtonCirclePlayPause4.c = color(40, 40, 40);
FineAssButtonCirclePlayPause5.c = color(30, 30, 30);
FineAssButtonCirclePlayPause6.c = color(15, 15, 15);
FineAssButtonCirclePlayPause7.c = color(0, 0, 0);
}
}
println(Playing);
}
MouseClicked ---->
void mouseClicked () {
if (Playing == true) {
if ( FineAssButtonCirclePlayPause1.width1/2 >= sqrt( sq( FineAssButtonCirclePlayPause1.xpos1 - mouseX) + sq( FineAssButtonCirclePlayPause1.ypos1 - mouseY))) {
background(255);
// Changes the color of the Play / Pause buttons circles back to standard.
FineAssButtonCirclePlayPause1.c = color(25, 25, 25);
FineAssButtonCirclePlayPause2.c = color(50, 50, 50);
FineAssButtonCirclePlayPause3.c = color(75, 75, 75);
FineAssButtonCirclePlayPause4.c = color(100, 100, 100);
FineAssButtonCirclePlayPause5.c = color(125, 125, 125);
FineAssButtonCirclePlayPause6.c = color(150, 150, 150);
FineAssButtonCirclePlayPause7.c = color(175, 175, 175);
Playing = false;
}
}
else{
if ( FineAssButtonCirclePlayPause1.width1/2 >= sqrt( sq( FineAssButtonCirclePlayPause1.xpos1 - mouseX) + sq( FineAssButtonCirclePlayPause1.ypos1 - mouseY))) {
background(255);
// Changes the color of the Play / Pause buttons circles back to standard.
FineAssButtonCirclePlayPause1.c = color(25, 25, 25);
FineAssButtonCirclePlayPause2.c = color(50, 50, 50);
FineAssButtonCirclePlayPause3.c = color(75, 75, 75);
FineAssButtonCirclePlayPause4.c = color(100, 100, 100);
FineAssButtonCirclePlayPause5.c = color(125, 125, 125);
FineAssButtonCirclePlayPause6.c = color(150, 150, 150);
FineAssButtonCirclePlayPause7.c = color(175, 175, 175);
Playing = true;
}
}
}
class FineAssButtonTriangle {
// Global variables.
int x1;
int x2;
int x3;
int y1;
int y2;
int y3;
color C;
// Constructor.
FineAssButtonTriangle(int _C, int _x1, int _y1, int _x2, int _y2, int _x3, int _y3) {
C = _C;
x1 = _x1;
x2 = _x2;
x3 = _x3;
y1 = _y1;
y2 = _y2;
y3 = _y3;
}
//Functions.
void Run() {
FineAssButtonTrianglePlayPause1.DisplayTriangle();
FineAssButtonTriangleNext1.DisplayTriangle();
FineAssButtonTriangleNext2.DisplayTriangle();
FineAssButtonTrianglePrevious1.DisplayTriangle();
FineAssButtonTrianglePrevious2.DisplayTriangle();
}
void DisplayTriangle() {
fill(C);
triangle(x1, y1, x2, y2, x3, y3);
}
}
1
