Comunidad de diseño web y desarrollo en internet

Redibujar los bordes de una imagen con ActionScript

Esta serie de 10 tips que iré publicando, está dedicada a la conversión y descomposición de imágenes, clips y textos en elementos sencillos que podamos manipular con actionscript.

Con estos scripts conseguiremos varios objetivos básicos:

  • Vectorizar una imagen: Convirtiéndola primero en una serie (array) de puntos por color, forma independiente y posición.
  • Detectar sus bordes: Para poder convertirlos en equivalentes a GUIAS de movimiento útiles dinámicamente.
  • Comprimir y descomprimir: Pudiendo salvar no la imagen, -que podemos no incluir en el trabajo final- sino un fichero con sus datos vectorizados (puntos, rectas y curvas) y utilizable como imagen vectorizada, secuenciada y con mucho menos peso.


Tomando una imagen de la biblioteca (también la podremos importar y exportar como vector más adelante) efectuamos una búsqueda de su bordes de color y su presentación como dibujo dinámico.

Existen 2 modos básicos de representar el efecto de dibujo: mediante la copia del pixel getPixel()/setPixel() y rellenado de zonas de color floodFill() o como líneas continuas moveTo/lineTo y relleno de un contorno cerrado beginFill().

En el ejemplo usamos las dos maneras pudiendo cambiar entre los 2 modos dinámicamente.
Podemos usar esta técnica con una imagen pero no obtendremos buenos resultados con un MovieClip por motivos del suavizado y alineación. Los MC los trataremos aparte cuando tratemos la adaptación de paletas de color.

Tampoco salvamos los datos, simplemente los representamos directamente con lo cual el código es poco complejo y muy rápido, y tampoco (pues no es necesario aquí) optimizamos la vectorización para convertir secuencias de puntos en rectas y curvas definidas como haremos posteriormente.

PARTE I: Dibujando bordes de una imagen:





Nota: El escalado de SWF para colocarlo aquí hace que se pierda nitidez en la representación, recomiendo descargar el .fla (86Kb) para estudiarlo y observarlo mejor.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate