Bienvenido a Klr20mg

Cronicas de un desarrollador

Actualmente soy Jefe de Desarrollo del area Flash en Sapotek de México en la cual trabajo desde hace mas de 4 años. Desarrollando aplicaciones en Flash para Web mas comúnmente llamadas (RIAs)

Estas en : Blog » De Circulos
  • Decrease font size
  • Default font size
  • Increase font size
  • color default
  • color verde
  • color azul
De Circulos
AddThis Social Bookmark Button
Post2PDF Print
July 14th, 2004

Todos alguna vez nos hemos visto en la necesidad de crear circulo en tiempo de ejecución, es decir, mediante ActionScript.

Para ello existen varias formas, pero, ¿cual es la más correcta?, ¿la forma mas "corta"?, cada quien tiene su forma preferida, yo usaba esto:

Actionscript:
  1. //Parametros target, radio, posicion x y posicion y
  2. function creaCirculo(clip, r, x, y) {
  3.     trace(clip);
  4.     clip.moveTo(x+r, y);
  5.     a = Math.tan(22.5*Math.PI/180);
  6.     for (var angulo = 45; angulo<=360; angulo += 45) {
  7.         var xFinal = r*Math.cos(angulo*Math.PI/180);
  8.         var yFinal = r*Math.sin(angulo*Math.PI/180);
  9.         var cx = xFinal+r*a*Math.cos((angulo-90)*Math.PI/180);
  10.         var cy = yFinal+r*a*Math.sin((angulo-90)*Math.PI/180);
  11.         clip.curveTo(cx+x, cy+y, xFinal+x, yFinal+y);
  12.     }
  13. }
  14. //creamos el MovieClip que contendra el circulo
  15. clip = this.createEmptyMovieClip("c", 1);
  16. //El formato de borde
  17. clip.lineStyle(1, 0xFF0000, 100);
  18. //El color de relleno
  19. clip.beginFill(0xFF0000, 100);
  20. //Llamamos a la funcion
  21. creaCirculo(clip, 15, 50, 25);

Un poco complicado, pero da resultado.

La manera mas "corta" o simple que conozco solo tiene 3 líneas de código.

Actionscript:
  1. //Creamos y posicionamos el target
  2. clip = this.createEmptyMovieClip("clip", 5);
  3. clip._x = 100;
  4. clip._y = 25;
  5. //Creamos una linea lo mas delgada posible
  6. //en este caso 0.2, pero con un grosor grande
  7. //para reproducir el efecto de circulo
  8. clip.lineStyle(30, 0x000000, 100);
  9. clip.moveTo(0, 0);
  10. clip.lineTo(0.2, 0);

¿Se ve alguna diferencia con el resultado final? :D

Descarga el Fla

Saludos!! 8)

Posibles Posts Relacionados
5 Comentarios

Si deseas poner codigo en tu comentario utiliza la etiqueta < pre > < /pre >

Pues la verdad es que el segunod métido crea un circulo "en codiciones" y la version primera y más larga, crea un circulo con un bocado ¿? Y eso?

luman escribio el 15-July-2004 a las 4:11 am

el circulo rojo, tiene una parte en la que no se dibujo la curva.

cual metodo dibujo a cual circulo???

NibblesMX escribio el 17-July-2004 a las 12:54 pm

me parece que el rojo esta hecho con el primer metodo, se ve por el beginFill ;)

Hector (cent_gen) escribio el 18-July-2004 a las 8:07 pm

jeje asi es....

EL rojo se crea con el primer metodo... :D

Tmeister escribio el 19-July-2004 a las 10:04 am

Se ve mas perfecto el rojo, me imagino k fue creado con el primer metodo

vicman escribio el 10-January-2006 a las 3:58 pm

 Blog editado por:

Enrique Chavez aka Tmeister

 Sigueme en Twitter

  • A punto de iniciar un curso de joomla, A ver que tal 2 hrs ago
  • Que divertido es modificar el blog "En caliente" y que todo deje de funcionar. XD 5 hrs ago
  • More updates...

Posting tweet...

 Suscribete


AddThis Social Bookmark Button

 Archivo

2008
2007
2006
2005
2004