Trying to make a animation where it gradually grows and then shrinks but it bugs

	if (vision < 150) {
				vision_speed = 1;
			}
			if (vision > 250) {
				vision_speed = -1;
			}
			
			
			vision = vision + vision_speed;
			////////////////////////////////////////////

The growing and shrinking part

boolean big_if_close = true;
boolean small_if_close = false;
boolean limited_vision = false;
float vision_speed;

int r;
int g;
int b;

int vision = 149;

color pinkFrame = color(255, 200, 10);

color strokeS = color(255, 200, 10);
int rectS = 20;
int rectS1 = 20;
int rectS2 = 20;
int rectS3 = 20;
int rectS4 = 20;


void setup() {
    frameRate(60);
    size(1020, 560);
}

void draw() {
	 background(0);
if (keyPressed && key == '1') {
		big_if_close = true;
		small_if_close = false;
		limited_vision = false;
	}
	if (keyPressed && key == '2') {
			big_if_close = false;
			limited_vision = false;
			small_if_close = true;
	}
	
		if (keyPressed && key == '3') {
		vision = 149;
			limited_vision = true;
			big_if_close = false;
			small_if_close = false;
	}
	
	if (keyPressed && key == '+') {
	vision += 2;
	}
		
		if (keyPressed && key == '-') {
	vision -= 2;
	}
	
	
	
		/////////////////////////////////////////////////////////////////
		if (mouseX > 89 && mouseX < 111 && mouseY > height - 30 && mouseY < height - 10) {
			rectS = 23;
		} else rectS = 20;
	
	if (mouseX > 89 && mouseX < 111 && mouseY > height - 30 && mouseY < height - 10 && mousePressed) {
		big_if_close = true;
		small_if_close = false;
		limited_vision = false;
		}

		///////////////////////////////////////////////////////////

		if (mouseX > 129 && mouseX < 151 && mouseY > height - 30 && mouseY < height - 10) {
			rectS1 = 23;
		} else rectS1 = 20;

		if (mouseX > 129 && mouseX < 151 && mouseY > height - 30 && mouseY < height - 10 && mousePressed) {

			big_if_close = false;
			limited_vision = false;
			small_if_close = true;
		}
		//////////////////////////////////////////////////////////////
		if (mouseX > 169 && mouseX < 191 && mouseY > height - 30 && mouseY < height - 10) {
			rectS2 = 23;
		} else rectS2 = 20;

		if (mouseX > 169 && mouseX < 191 && mouseY > height - 30 && mouseY < height - 10 && mousePressed) {
			vision = 149;
			limited_vision = true;
			big_if_close = false;
			small_if_close = false;
		}

		//////////////////////////////////////////////////////////////////
	
			if (mouseX > 209 && mouseX < 231 && mouseY > height - 30 && mouseY < height - 10) {
			rectS3 = 23;
		} else rectS3 = 20;

		if (mouseX > 209 && mouseX < 231 && mouseY > height - 30 && mouseY < height - 10 && mousePressed) {
			r = 0;
			g = 0;
			b = 255;
		}
		
		//////////////////////////////////////////////////////////////////777
		if (mouseX > 249 && mouseX < 271 && mouseY > height - 30 && mouseY < height - 10) {
			rectS4 = 23;
		} else rectS4 = 20;
		if (mouseX > 249 && mouseX < 271 && mouseY > height - 30 && mouseY < height - 10 && mousePressed) {
			r = 255;
			g = 192;
			b = 203;
		}
	
	
	
	
	// spacing is the distance between each ellipse
	int spacing_x = 45;
	int spacing_y = 45;
	// the for loop sets a value which the integer starts in, its limit and then the increment that will happen every loop. 
	 for (int x = 0; x < width; x = x + spacing_x) {
	for (int y = 0; y < height-50; y = y + spacing_y) {
		// dist is used to set a value for the distance between 2 things. In this case it is used to calculate/ set a value to the ellipses. 
		// Because the "for loop" continues every frame and the way the different integers change within the loops, we get ellipses with different sizes and colors. 
		int distance_mouse_ellipse = dist(x, y, mouseX, mouseY);
int r = dist(0, y, x, y) /4;
	int g = dist (x, 0, x, y) /2;
		int b = r+g/3; 
            fill(r, g, b);
		rectMode(CENTER);
		noStroke();
		
	//	float size = map(distance_mouse_ellipse, 0, 200,45, 4);  
if (big_if_close) {
  ellipse(x, y, size, size);
	float size = map(distance_mouse_ellipse, 0, width,60, 4);
}
		if(small_if_close) {
			float size = map(distance_mouse_ellipse, 0, width,60, 4);
	    ellipse(x, y, distance_mouse_ellipse/14, distance_mouse_ellipse/14);
		}        
		
		if (limited_vision) {
			float size = map(distance_mouse_ellipse, 0, vision,45, 4)
		
			
			ellipse(x, y, size, size);
			fill(255-r, 255-g, 255-b);
			ellipse(width-x, height-y, size, size);
		 ////////////////////////////////////////////
			if (vision < 150) {
				vision_speed = 1;
			}
			if (vision > 250) {
				vision_speed = -1;
			}
			
			
			vision = vision + vision_speed;
			////////////////////////////////////////////
	
	}
	
	
	}
		 
		 
 }
	
		fill(255)
		rectMode(CENTER);
		stroke(strokeS);
		strokeWeight(2)

		rect(100, height - 20, rectS, rectS);
		
		rect(140, height - 20, rectS1, rectS1);
		
		rect(180, height - 20, rectS2, rectS2);
		
		rect(220, height - 20, rectS3, rectS3);
		
		rect(260, height - 20, rectS4, rectS4);
		
}


the whole code

Hi! There seems to be some errors that 1) you are missing some semicolons and 2) some lines need (int) keyword to convert float to int. Also there is a size parameter that is not defined anywhere.

“it bugs” can mean that you have the error that prevents the code from running or that the code runs but not as you intended. It would be much better if you can elaborate a bit more on the problem itself :slight_smile:

1 Like

Ok, the program makes it so the the ellipses just grow really fast and then shrinks a bit and just repeats itself

I will try what you said