La funcionalidad integrada en ActionScript que permite crear gráficos vectoriales (líneas, curvas, formas, rellenos y degradados) y mostrarlos en la pantalla mediante ActionScript recibe el nombre de API de dibujo. La clase flash.display.Graphics es la encargada de proporcionar esta funcionalidad. Con ActionScript es posible dibujar en cualquier instancia de Shape, Sprite o MovieClip utilizando la propiedad graphics definida en cada una de esas clases (la propiedad graphics de cada una de esas clases es, de hecho, una instancia de la clase Graphics).
A la hora de empezar a dibujar mediante código, la clase Graphics ofrece varios métodos que facilitan el trazado de formas comunes, como círculos, elipses, rectángulos y rectángulos con esquinas redondeadas. Todas ellas se pueden dibujar como líneas vacías o como formas rellenas. Cuando sea necesaria una funcionalidad más avanzada, la clase Graphics también dispone de métodos para trazar líneas y curvas cuadráticas de Bézier, que se pueden emplear junto con las funciones trigonométricas de la clase Math para crear cualquier forma imaginable.
Tareas comunes de la API de dibujo
A continuación se presenta un conjunto de tareas que suelen realizarse mediante la API de dibujo de ActionScript y que se estudiarán en este capítulo:
Definir estilos de línea y de relleno para dibujar formas
Dibujar líneas rectas y curvas
Usar métodos para dibujar formas como círculos, elipses y rectángulos
Dibujar con líneas de degradados y rellenos
Definir una matriz para crear un degradado
Usar funciones trigonométricas con la API de dibujo
Incorporar la API de dibujo en una animación
Conceptos y términos importantes
La siguiente lista de referencia contiene términos importantes que se utilizan en este capítulo:
Punto de ancla: uno de los dos puntos finales de una curva cuadrática de Bézier.
Punto de control: punto que define la dirección y la curvatura de una curva cuadrática de Bézier. La línea curva nunca alcanza el punto de control, no obstante, se curva como si fuese arrastrada hacia éste.
Espacio de coordenadas: gráfica de coordenadas contenida en un objeto de visualización sobre la que se colocan sus elementos secundarios.
Relleno: parte interior sólida de una forma que tiene una línea rellena con color o la totalidad de una forma que no tiene contorno.
Degradado: color que está formado por la transición gradual de un color a otro u otros (a diferencia de un color sólido).
Punto: ubicación individual en un espacio de coordenadas. En el sistema de coordenadas bidimensional utilizado en ActionScript, el punto se define por su ubicación en el eje x y en el eje y (las coordenadas del punto).
Curva cuadrática de Bézier: tipo de curva definida por una fórmula matemática concreta. En este tipo de curva, la forma se calcula basándose en las posiciones de los puntos de ancla (los extremos de la curva) y el punto de control que define la dirección y la curvatura del trazo.
Escala: tamaño de un objeto en relación con su tamaño original. Ajustar la escala de un objeto significa cambiar su tamaño estirándolo o encogiéndolo.
Trazo: parte del contorno de una forma que tiene una línea rellena con un color o las líneas de una forma sin relleno.
Trasladar: cambiar las coordenadas de un punto de un espacio de coordenadas a otro.
Eje X: eje horizontal del sistema de coordenadas bidimensional que se utiliza en ActionScript.
Eje Y: eje vertical del sistema de coordenadas bidimensional que se utiliza en ActionScript.
Ejecución de los ejemplos del capítulo
A medida que progrese en el estudio de este capítulo, podría desear probar algunos de los listados de código de ejemplo. Como este capítulo se centra en la manera de dibujar contenido visual, para probar los listados de código hay que ejecutarlos y ver los resultados en el archivo SWF creado. Para probar los listados de código:
Cree un documento de Flash vacío.
Seleccione un fotograma clave en la línea de tiempo.
Abra el panel Acciones y copie el listado de código en el panel Script.
Ejecute el programa seleccionando Control > Probar película.
Puede ver el resultado del código en el archivo SWF creado.