p5 Animation
- Steven Gonzalez
- Oct 29, 2019
- 1 min read
for this assignment I decided to use random one the color of the ellipse and the color of the background and too change the size of the ellipse and change the speed. The only problem I ran into was using the random to change the direction of the ellipse it
if(xPos>(400-bSize/2) &&(xPos<bSize/2) for some reason that wasn't working so I had to separate it and in the if(xPos<bSize/2) i made the values used in random negative but still negate it but that fixed it. I also saw a small problem with changing the shape if its a small ellipse then changes to larger one part of it goes outside the box but it works fine after when it hits the edge.
var xPos;
var yPos;
var xSpeed;
var ySpeed;
var bSize;
var R;
var G;
var B;
var R2;
var G2;
var B2;
function setup() {
createCanvas(400, 400);
R=random(0,225);
G=random(0,225)
B=random(0,225)
R2=0
G2=0
B2=0
xPos=150;
yPos=150;
xSpeed=random(-10,10)
ySpeed=random(-10,10);
bSize=random(0,50);
}
function draw() {
background(R2,G2,B2);
fill(R,G,B)
ellipse(xPos,yPos,bSize,bSize)
yPos +=ySpeed;
xPos +=xSpeed;
//if our ellipse touches the right edge, bounce back...
//move to the opposite direction)
if(xPos>(400-bSize/2)){
xSpeed=random(1,10);
xSpeed=-xSpeed;
R=random(0.225)
G=random(0,225)
B=random(0,225)
R2=random(0,225)
G2=random(0,225)
B2=random(0,225)
bSize=random(0,50);
}
if(xPos<bSize/2){
xSpeed=random(-1,-10)
xSpeed=-xSpeed
R=random(0,225)
G=random(0,225)
B=random(0,225)
R2=random(0,225)
G2=random(0,225)
B2=random(0,225)
bSize=random(0,50);
}
if(yPos>(400-bSize/2)){
ySpeed=random(1,10);
ySpeed=-ySpeed;
R=random(0,225)
G=random(0,225)
B=random(0,225)
R2=random(0,225)
G2=random(0,225)
B2=random(0,225)
bSize=random(0,50);
}
if(yPos<(bSize/2)){
ySpeed=random(-1,-10)
ySpeed=-ySpeed
R=random(0,225)
G=random(0,225)
B=random(0,225)
R2=random(0,225)
G2=random(0,225)
B2=random(0,225)
bSize=random(0,50);
}
if((R==R2)&&(G==G2)&&(B==B2)){
R2=random(0,225)
G2=random(0,225)
B2=random(0,225)
}
}
Commentaires