Recitation Exercise:
For the recitation exercise, we are required to integrate the coding elements from this week’s classes to create an interactive animation in Processing. I want to use mouse interaction and variable function to design a simple game: Players use the mouse to control a small ball and try to avoid another moving ball, and the player who persists for a longer time wins. I first defined the function of the position of the balls using x, y, speedX, speedY. By coding ellipse(mouseX, mouseY, 20, 20), I make the small ball be able to move according to the player’s mouse movement. Then I defined ballColor() using “if” function to make two balls randomly change colors once the big one hit the wall. To increase the difficulty of the game, I used keyPressed() to make the speed of the big ball variable so that another person could adjust the speed to add difficulty to the player. The interesting part I learned is the function called boolean(). This function is about TRUE or FALSE. By using it, I make all balls and the timer stop once the player fails to avoid the big ball. I first made “boolean ballStop = false.” When “ballStop == false,” ballMove() runs; when two balls touch each other, ballStop becomes TRUE, and all changing things stop. By designing this small game, I learned how boolean function is applied. The boolean function is convenient for programmers to control the condition under which a variable occurs.
Video:
Code:
int x = 300;
int y = 300;
int size=60;
int speedX =1;
int speedY =1;
int bgColor;
int m;
boolean ballStop = false;
void setup() {
size(600, 600);
bgColor = 125;
fill(0, 125, 125);
speedX=int(random(2, 10));
speedY=int(random(2, 10));
frameRate(60);
}
void draw() {
background(bgColor);
ellipse(x, y, size, size);
if (ballStop == false) {
ballMove();
}
ballBounce();
ballColor();
ellipse(mouseX, mouseY, 20, 20);
if (ballStop) {
text(m/1000.0, 60, 60);
} else {
text(millis()/1000.0, 60, 60);
}
//text(m/1000.0, 60, 60);
float d = dist(mouseX, mouseY, x, y);
if (d <= 50 && ballStop == false) {
//if ((mouseX> x-10) && (mouseX<x+10) && ((mouseY>y-10) && (mouseY<y+10) )) {
//background (0);
//bgColor = 0;
ballStop = true;
speedX = 0;
speedY = 0;
m = millis();
println(“hit”);
}
print(mouseX);
print(” “);
print(mouseY);
print(” “);
print(x);
print(” “);
print(y);
print(” “);
print(d);
print(” “);
print(ballStop);
println();
}
void ballBounce() {
x=x+speedX;
if (x>width || (x<0)) {
speedX *=-1;
}
y=y+speedY;
if (y>height || (y<0)) {
speedY *=-1;
}
}
void ballMove() {
y=y+speedY;
x=x+speedX;
}
void ballColor() {
if ((x>width || (x<0))||(y>height || (y<0))) {
int r =int(random(0, 255));
int g =int(random(0, 255));
int b =int(random(0, 255));
fill(r, g, b);
noStroke();
}
}
void keyPressed() {
if (key == CODED) {
if (keyCode==UP) {
speedY –;
} else if (keyCode ==DOWN) {
speedY++;
} else if (keyCode ==LEFT) {
speedX–;
} else if (keyCode ==RIGHT) {
speedX++;
}
}
if (key == ‘r’) {
ballStop = false;
speedX = int(random(2, 10));;
speedY = int(random(2, 10));;
}
}
Recitation Homework:
STEP1
STEP2
STEP3
STEP4&BONUS
CODE
int r=150;
int speed=3;
int c=0;
int xspeed = 0;
int yspeed = 0;
int x = 150;
int y = 150;
void setup(){
size(600,600);
background(255);
}
void draw(){
x = x+xspeed;
y = y+yspeed;
drawCircle(x,y);
if(x>=250|x<=50){
xspeed = 0;
}
if(y>=250|y<=50){
yspeed = 0;
}
}
void drawCircle(int x,int y){
pushMatrix();
translate(x,y);
//draw a circle
background(255);
strokeWeight(20);
ellipse(x,y,r,r);
r = r + speed;
if (r>300){
speed =-3;
}
if (r<80){
speed =3;
}
colorMode(HSB);
stroke(c,255,255);
if(c<255){
c=c+1;
}
if(c==255){
c=c-255;
}
popMatrix();
}
void keyPressed() {
if (key == CODED) {
if (keyCode == RIGHT) {
xspeed = 2;
} else if (keyCode == LEFT) {
xspeed = -2;
} else if (keyCode == UP) {
yspeed = -2;
} else if (keyCode == DOWN) {
yspeed = 2;
} else if (keyCode == SHIFT) {
xspeed = 0;
yspeed = 0;
}
}
}