myGame

Screen Shot 2017-06-05 at 12.48.38 PM.png

When either a left, right, up, or down button is pressed the circle that initially starts in the center of the console moves, and the circle changes color when each button is pressed. When the up button is pressed when the circle is traveling up the circle moves quicker; when the circle is traveling, but you press the down button the circle startsslowing down. Screen Shot 2017-06-05 at 12.53.42 PM.png

This shows that when the when either a left, right, up, or down button is pressed the circle does not change colors anymore, but what does change is the color of the background of the controller and the buttons. When the circle hits any wall, but the top one, the color of the background and buttons change to gray. When either the buttons are pressed or the circle hits the ceiling of the console the colors of the background and buttons change.

Screen Shot 2017-06-05 at 1.02.20 PM.png

This screenshot is showing that when the circle touches a wall or a button is pressed by the user the color of the background and buttons change.

Advertisements

bounce.pde

Screen Shot 2017-04-03 at 12.54.00 PM

The is the first bounce version, I managed to add movement to the circle in all four directions. I also had the circle change color when the middle button on the device had it been pressed.

Screen Shot 2017-04-06 at 12.41.17 PM.png

I added a new color to the circle every time I change the direction of the circle in the second version of the code.

Screen Shot 2017-04-06 at 12.45.08 PM.png

In the third version of bounce I added to the code, code to make it so that the ball bounces off the north and south end of the device’s screen.

Screen Shot 2017-04-06 at 12.47.05 PM.png

In the fourth version of bounce I added to the code, code to make it so that the ball bounces off the eastern end of the device’s screen.

Screen Shot 2017-04-06 at 12.48.56 PM.png

In the fifth, and final version of bounce I added to the code, code to make it so that the ball bounces off the western end of the device’s screen; hence the ball being able to bounce off all sides of the device.

control.pde

// This Processing program creates a little animation machine
// with controls that you can customize.
// First, we need to “declare” a few variables of 3 different types.
int bDia, cDia, mvX, mvY;
float cX, cY, clickX, clickY;
color cCol;

void setup() {
size(201, 400);  // Create a program window 201 pixels wide and 400 pixels high.
stroke(127); // Set the color for the outlines of our shapes.
bDia = 20; // Set the diameter of our circular control buttons.
cDia = 20; // Set the diameter of the “action circle” we will control.
cX = 100;  // Set the starting horizontal position of the action circle.
cY = 300;  // Set the starting vertical position of the action circle.
cCol = color(255, 255, 255);  // Set the starting color of the action circle.
mvX = 0;  // Set the horizontal movement of the action circle.
mvY = 0;  // Set the vertical movement of the action circle.
}

void draw() {
// These first 4 lines let you use math coordinates instead of computer coordinates.
scale(1, -1);
translate(0, -height);
clickX = mouseX;
clickY = height – mouseY;

fill(255); // Color the screen white.
rect(0, 200, 200, 200);  // Draw the square “action screen”.

ellipse(100, 60, bDia, bDia); // Draw the bottom button.
ellipse(100, 100, bDia, bDia); // Draw the middle button.
ellipse(100, 140, bDia, bDia); // Draw the top button.
ellipse(60, 100, bDia, bDia); // Draw the left button.
ellipse(140, 100, bDia, bDia); // Draw the right button.

fill(cCol);  // Set the color for the action circle.
cX = cX + mvX; // Set the horizontal position of the action circle.
cY = cY + mvY; // Set the vertical position of the action circle.

// The 2 “print lines” below will display at the bottom of this window.
// They will let us check the coordinates of the program window.
println(“X =”, clickX);
println(“Y =”, clickY);

ellipse(cX, cY, cDia, cDia); // Draw the action circle.
}

void mousePressed() {
//Check if the user clicked the middle button.
if (dist(clickX, clickY, 100, 100) < bDia/2) {
cCol = color(255, 0, 0);
// If so, turn the action circle red.
}

//Check if the user clicked the top button.
else if (dist(clickX, clickY, 100, 140) < bDia/2) {
mvY = 1;
//If so, make the action circle move upwards.
}
//Check if the user clicked the bottom button.
else if (dist(clickX, clickY, 100, 60) < bDia/2) {
mvY = -1;
//If so, make the action circle move downwards.
}
//Check if the user clicked the left button.
else if (dist(clickX, clickY, 60, 100) < bDia/2) {
mvX = -1;
//If so, make the action circle move left
}
//Check if the user clicked the right button.
else if (dist(clickX, clickY, 140, 100) < bDia/2) {
mvX = 1;
//If so, make the action circle move right.
}

}