# Como agrego void draw(){ para animar el dibujo de este programa

**URL:** <https://discourse.processing.org/t/como-agrego-void-draw-para-animar-el-dibujo-de-este-programa/25922>\
**Category:** Español\
**Created:** [December 3, 2020, 9:24am UTC](https://discourse.processing.org/t/como-agrego-void-draw-para-animar-el-dibujo-de-este-programa/25922 "2020-12-03T09:24:36Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![UnderHok](https://avatars.discourse-cdn.com/v4/letter/u/848f3c/32.png) [@UnderHok](https://discourse.processing.org/u/UnderHok)\
**Post date:** [December 3, 2020, 9:24am UTC](https://discourse.processing.org/t/como-agrego-void-draw-para-animar-el-dibujo-de-este-programa/25922/1 "2020-12-03T09:24:36Z")

</div>

como agrego void draw(){ a este código para ver como se va dibujando de el centro a donde finaliza

**//code variable star**

void star(int pointCount, float innerRadius,float outerRadius){  
float theta = 0.0;  
int vertCount = pointCount \* 2;  
float thetaRot = TWO\_PI/vertCount;  
float tempRadius = 0.0;  
float x = 0.0, y= 0.0;

beginShape();  
for(int i = 0;i\<pointCount;i++){  
for(int j=0; j\<2; j++){  
tempRadius = innerRadius;  
if(j%2==0){  
tempRadius=outerRadius;  
}  
x = cos(theta)\* tempRadius;  
y = sin(theta)\* tempRadius;  
vertex(x,y);  
theta += thetaRot;  
}  
}  
endShape(CLOSE);  
}

**//code draw**

void setup(){  
size(1000,1000);  
background(0);  
noStroke();  
translate(width/2, height/2);

int pointCount = 15;  
int steps = 35;  
float outerRadius = width \* .5;  
float innerRadiusFactor = .7;  
float innerRadius = outerRadius \* innerRadiusFactor;  
float outerRadiusRatio = outerRadius / steps;  
float innerRadiusRatio = innerRadius / steps;  
float shadeRatio = 255 / steps;  
float rotationRatio = 45.0 / steps;

for(int i=0; i\<steps; i++){  
stroke(255 - shadeRatio \* i,100);  
colorMode(HSB);  
fill(shadeRatio \* i,100,100);  
pushMatrix();  
rotate(rotationRatio \* i \* PI / 90);  
star(pointCount, outerRadius - outerRadiusRatio \* i, innerRadius - innerRadiusRatio \* i);  
popMatrix();  
}  
}

---

<div class="post-metadata">

**Author:** ![noel](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noel/32/213_2.png) [@noel](https://discourse.processing.org/u/noel)\
**Post date:** [December 3, 2020, 10:37am UTC](https://discourse.processing.org/t/como-agrego-void-draw-para-animar-el-dibujo-de-este-programa/25922/2 "2020-12-03T10:37:11Z")

</div>

Verifique los cambios con su código y des-comenta background () en el draw() también.  
Por favor aprenda a publicar un código con un cuadro como yo.  
Luego, copiar el código es más fácil usando el botón que aparece encima de la barra de desplazamiento vertical.

```auto
int i, steps, pointCount;
float shadeRatio, outerRadius, innerRadiusFactor, rotationRatio;
float innerRadius, outerRadiusRatio, innerRadiusRatio;

void star(int pointCount, float innerRadius, float outerRadius) {
  float theta = 0.0;
  int vertCount = pointCount * 2;
  float thetaRot = TWO_PI/vertCount;
  float tempRadius = 0.0;
  float x = 0.0, y= 0.0;

  beginShape();
  for (int i = 0; i<pointCount; i++) {
    for (int j=0; j<2; j++) {
      tempRadius = innerRadius;
      if (j%2==0) {
        tempRadius=outerRadius;
      }
      x = cos(theta)* tempRadius;
      y = sin(theta)* tempRadius;
      vertex(x, y);
      theta += thetaRot;
    }
  }
  endShape(CLOSE);
}

void setup() {
  size(1000, 1000);
  background(0);
  noStroke();
  translate(width/2, height/2);
  pointCount = 15;
  steps = 35;
  outerRadius = width * .5;
  innerRadiusFactor = .7;
  innerRadius = outerRadius * innerRadiusFactor;
  outerRadiusRatio = outerRadius / steps;
  innerRadiusRatio = innerRadius / steps;
  shadeRatio = 255 / steps;
  rotationRatio = 45.0 / steps;
}

void draw() {
 // background(0);
  translate(width/2, height/2);
  i++;
  if (i == steps-1) i = 0; 
  stroke(255 - shadeRatio * i, 100);
  colorMode(HSB);
  fill(shadeRatio * i, 100, 100);
  pushMatrix();
  rotate(rotationRatio * i * PI / 90);
  star(pointCount, outerRadius - outerRadiusRatio * i, innerRadius - innerRadiusRatio * i);
  popMatrix();
}

```

---

<div class="post-metadata">

**Author:** ![UnderHok](https://avatars.discourse-cdn.com/v4/letter/u/848f3c/32.png) [@UnderHok](https://discourse.processing.org/u/UnderHok)\
**Post date:** [January 12, 2021, 1:28am UTC](https://discourse.processing.org/t/como-agrego-void-draw-para-animar-el-dibujo-de-este-programa/25922/3 "2021-01-12T01:28:28Z")

</div>

gracias, realmente me sirvió tu respuesta