How do I use FOR LOOP to move multiple ellipses?

Processing Beginners
1

First time posting on here, so I’m not sure how everything works. But I’m trying to copy the eye I have already made with a for loop. Earlier I tried to do them all individually but the eyes vanished completely. Not all great with Java so this is probably an easy fix. Recently made the int=230 so the program would understand it. Any help would be appreciated.


int a = 230;

void setup()
{
  size(600, 600); 
  background(32, 55, 150); 
  int r= 0;
}
void draw()
{
  for (int i=0; i<100; i++)
  { 
    noLoop();
    Rays(width/2, height/2, random(10, 0.5), random(0.1, 0.1), 8*PI/50*i+random(PI/100), (int)random(58, 128));
    Rays(width/2, height/2, random(20, 0.10), random(0.8, 0.8), 8*PI/50*i+random(PI/100), (int)random(58, 128));
    Rays(width/2, height/2, random(30, 0.20), random(0.8, 0.8), 8*PI/50*i+random(PI/100), (int)random(58, 128));
  }
  Owl();
  }
void Rays (int a, int b, float sx, float sy, float angle, int alpha)
{
  pushMatrix();
  translate(a, b);
  rotate(angle);
  scale(sx, sy);

  fill(255, 226, 94, alpha);
  noStroke();

  beginShape();
  vertex(0, 0); 
  bezierVertex(0, 24, 0, -54, 30, -72);
  bezierVertex(54, -90, 72, -117, 72, -144);
  bezierVertex(100, -144, 96, -96, 78, -72);
  bezierVertex(66, -44, 0, -36, 0, 0);
  endShape();
  popMatrix();
}
void Owl()
{
  //body
  smooth();
  noStroke();
  fill(207, 178, 128);
  ellipse(width/2, height/2, 400, 400);
  ellipse(320, 255, 400, 400);

  //face with beige
  fill(189, 154, 94);
  ellipse(245, 220, 210, 210);
  ellipse(365, 220, 210, 210); 
arc(245, 245.5, 200, 250, 0, PI);
  arc(365, 245.5, 200, 250, 0, PI);

  //face with white
  fill(255);
  ellipse(245, 230, 200, 200);
  ellipse(365, 230, 200, 200); 
  arc(245, 230, 200, 250, 0, PI);
  arc(365, 230, 200, 250, 0, PI);
  
    //face with dark gray
  fill(186, 186, 186);
  ellipse(245, 228.5, 165, 165); 
  ellipse(365, 228.5, 165, 165);
   arc(250, 250, 170, 170, 0, PI);
  arc(350, 250, 170, 170, 0, PI);
  
  //face with gray
  fill(227, 227, 227);
  ellipse(245, 230, 150, 150);
  ellipse(365, 230, 150, 150); 
  arc(250, 250, 150, 150, 0, PI);
  arc(350, 250, 150, 150, 0, PI);

  //beak
  fill(26, 27, 32);
  ellipse(300,290,20,20);
  noStroke();
  fill(26, 27, 32);
  beginShape(TRIANGLES);
  vertex(300, 360);
  vertex(290, 290);
  vertex(310, 290);
  endShape();

  //-----------------
  
  for(int a=230; a>400; a= a+50);
  
  fill(181, 106, 0);
  strokeWeight(5);
  stroke(247, 157, 47);
  ellipse(a, 230, 90, 90);
 
  //inner eye
  noStroke();
  fill(0);
  ellipse(230, 230, 55.5, 55.5);
  //ellipse(300, 266, 70,70);
 
  //middle eye
  pushMatrix();
  fill(255);
  ellipse(230, 230, 10, 10);
 
  //iris
  noStroke();
  fill(255);
  ellipse(215, 220, 20, 20);
  popMatrix();
 
 //------------------------
 
  //feathers
    noStroke();
     smooth();
   fill(117, 47, 13);
  for (int i=220; i < 400; i= i+50)
  ellipse(i, 400, 10, 20);
 
     noStroke();
     smooth();
   fill(117, 47, 13);
  for (int i=250; i < 400; i= i+50)
  ellipse(i, 450, 10, 20);
 
  //feathers
    noStroke();
     smooth();
   fill(117, 47, 13);
  for (int i=220; i < 400; i= i+50) 
  ellipse(i, 400, 10, 20);
  
     noStroke();
     smooth();
   fill(117, 47, 13);
  for (int i=250; i < 400; i= i+50) 
  ellipse(i, 450, 10, 20);
}


I have another question to ask but I'll leave that out for now.
1 Like
2

You need < instead of >

For loop: think of „as long as…“

Also NO ; here

Try { around the block you want to be repeated } instead of placing the ; please.

Warm regards,

Chrisir

2 Likes
3

Thank you! That really helped. I have another question but should I ask it in this post or make a new one? It’s about something different, the BeginShape function.

4

It’s within the same sketch so ask here please

5

Okay I’m wanting to add wings to my owl, so I wanted to use the BeginShape Function. I created the shape how I wanted it and to position it correctly I used translate(). I wanted the shape hiding behind the owl so the full thing isn’t displayed. But when I do that it also translates the owl, moving into the bottom corner of the screen. Should I send you the code with everything together? I currently have it seperate.

void setup()
{
  size(600,600);
}

void draw()
{
  fill(207, 178, 128);
  noStroke();
beginShape();
scale(1);
translate(360,360);
curveVertex(204,  391);
curveVertex(18,  -96);
curveVertex(268,  -19);
curveVertex(201,  170);
curveVertex(32, 100);
curveVertex(32, 100);
endShape();
  
}
2 Likes
6

Here is the trick

prior to using translate etc. say pushMatrix();.

It saves the situation before translate kicks in.

Now when the wing is done, say popMatrix();.

It restores the situation like it was before translate().

The two commands are a pair.

After popMatrix(); you start of with a blank situation for your canvas like it was before translate().

So now you can draw your owl without it getting translated down the screen. Nice.

Chrisir



void setup() {
  size(600, 600);
}

void draw() {
  owlWing1();
}

void owlWing1() {
  pushMatrix(); 
  fill(207, 178, 128);
  noStroke();
  beginShape();
  scale(1);
  translate(360, 360);
  curveVertex(204, 391);
  curveVertex(18, -96);
  curveVertex(268, -19);
  curveVertex(201, 170);
  curveVertex(32, 100);
  curveVertex(32, 100);
  endShape();
  popMatrix();
}
//
2 Likes
7

Thank you so much! I really appreciate it.

1 Like
8

And welcome here to the forum!

Great to have you here!

9

Thanks! :smiley: I’ll probably be using it a lot now, with everything being online.

Okay so I did run into one more problem. I want to flip the wing so it matches the right one. Is there a specific function for that?
After that I think I’ll be done.

1 Like
10

wild guess would be

scale(-1,0);

11

Nope didn’t work. The scale just deletes the wing. Thanks for trying tho. You’ve already done so much!

12

ah

scale(-1.0, 1.0);

13

complicate…





void setup() {
  size(1600, 600);
}

void draw() {
  owlWing1( false  );
  translate(20, 0);
  owlWing1(  true);
}

void owlWing1( boolean isLeft ) {
  pushMatrix(); 
  fill(207, 178, 128);
  noStroke();
  beginShape();
  translate(410, 360);
  if (isLeft)
    scale(-1.0, 1.0);
  else {
    // ignore
  }
  curveVertex(204, 391);
  curveVertex(18, -96);
  curveVertex(268, -19);
  curveVertex(201, 170);
  curveVertex(32, 100);
  curveVertex(32, 100);
  endShape();
  popMatrix();
}
//
1 Like
14

It looks so much better now :smiley: Thank you so much for your help.

1 Like
15

Hello,

I was inspired by your project.
Click the mouse to toggle the wings.

int a = 1;

void setup()
  {
  size(600,600);
  }

void draw()
  { 
  background(0);
  translate(width/2, height/2);  
  fill(207, 178, 128);
  stroke(255, 255, 0);
  strokeWeight(3);
  beginShape();
  scale(1);
  curveVertex(a*204,  391);
  curveVertex(a*18,  -96);
  curveVertex(a*268,  -19);
  curveVertex(a*201,  170);
  curveVertex(a*32, 100);
  curveVertex(a*32, 100);
  endShape();
  }
  
void mousePressed()
  {
  a = -a;
  }

Keep in mind you can manipulate the vertices for some cool effects.

:)

2 Likes