Artículos con etiqueta: Actionscript

Justo lo que necesitabas

Documentando el codigo

Febrero 11th, 2006

Uno de los errores mas graves que tengo cuando programo es que no me gusta comentar el codigo que hago. Y claro, es que pienso que gasto tiempo valioso: el tiempo que ocupo en escribir dos lineas de comentario, podria utilizarlo en crear un par de funciones, o una clase entera. Pues estoy muy equivocado. Esos pocos segundos que me ahorro por no documentar, me cuestan caro despues, cuando necesito actualizar mi codigo y no recuerdo lo que hice, que variables use, por que cree tal o cual funcion. De igual manera pasa cuando quiero reutilizar el codigo, pero no recuerdo como usarlo.

Pues bien, por eso es importantisimo documentar el codigo. Ademas, hay herramientas (para cada lenguaje de programacion) que me ayudan a crear una documentacion bonita y organizada a partir de los comentarios que he puesto en mi codigo. Hacer esto ayuda mucho, no solo para organizarte, sino tambien si deseas distribuir tu codigo: una documentacion bien realizada, facilita el uso del codigo.

En el caso de actionscript, hay varios programas, algunos estan listados en osflash. Me decidi probar dos: NaturalDocs y as2api. Cada uno tiene reglas especificas para documentar tu codigo, para luego correr un comando que parsea estos comentarios y genera la documentacion.

Me gusta NaturalDocs por el hecho de que sus reglas son mucho mas faciles de recordar. La presentacion de la documentacion es bastante elegante, y sobretodo es facil de usar. Tambien puedes configurar y crear nuevos menus a tu gusto (cambiando los archivos de documentacion). Ademas, esta herramienta no es solamente para actionscript, puedes usarla para generar documentacion de distintos lenguajes de programacion como php, java, coldfusion, python, javascript, entre otros (ver la lista de lenguajes soportados). Luego de probarlo, hay solamente dos cosas que no me gustaron: documenta tambien funciones y variables privadas (que generalmente deseas ocultarlas) y si tienes funciones getter y setter, las documenta como dos metodos distintos.

as2api es un programa solamente para actionscript. Su sintaxis y estilo de documentacion estan basados en javadoc (herramienta para java). A pesar de que apenas esta en su version 0.4, as2api es bastante completo. Sus reglas de documentacion son faciles de aprender, sobretodo si has utilizado javadoc anteriormente. Que es lo que no me gusta de esta herramienta? que la documentacion generada se ve horrible :) pero todo es cuestion de jugar un poco con su hoja de estilos. La herramienta es mas basica, pero eso no significa que no sea buena.

Para muestra un boton: estoy trabajando en un proyecto del que hablare despues y que sera libre para que lo bajen. Probe ambas herramientas, y estos son los resultados:

Naturaldocs: mi documentacion (esta incompleta, pues no use sus reglas para comentar mi codigo)
As2api: mi documentacion sin modificar.
As2api: mi documentacion, despues de modificar la hoja de estilos.

En fin, me quede con as2api (con mi hoja de estilos). No es lo mejor del mundo, pero basta y sobra para mantener una buena documentacion de mi codigo.

Si programas en php, te recomiendo phpdoc

Finalmente, se que no el blog no ha estado muy activo, pero proximamente estare posteando un poco mas, sobre como utilizar as2api, utilizar clases abstractas, flickr, mi proyecto (del que acaban de ver la documentacion), entre otras cosas.

En un post anterior puse un experimento de actionscript para hacer un menu. En esta version tengo algunas mejoras, sobre todo, le di la posibilidad a los botones para ejecutar una funcion al ser oprimidos. Puedo destruir el menu llamando a un metodo. Puedo alinear el texto animado, a la derecha o bajo el menu.

Actionscript:
  1. //primero creo una referencia global al lugar donde esta el menu
  2. _global.myroot=this
  3. //creo las functiones respectivas a cada menu
  4. function traceID(){
  5.   trace(this.uid)
  6.   //dara como resultado el id del boton aplastado
  7. }
  8.  
  9. function traceLabel(){
  10.   trace(this.qlabel)
  11.   //dara como resultado la etiqueta del boton
  12. }
  13. //destruye el menu lilmenupanel
  14. function destroyMe(){
  15.   _global.myroot.lilmenupanel.destroyMenu()
  16. }
  17. //defino el texto que el menu tiene por default
  18. this.lilmenupanel.mainlabel="blog.innocuo.com"
  19. //anado items al menu, dos parametros: titulo del boton, y descripcion
  20. //el tercer parametro es una referencia a una funcion
  21. this.lilmenupanel.addMenuItem("Home","01 Home",this.traceID)
  22. this.lilmenupanel.addMenuItem("Contact","02 Contact",this.traceLabel)
  23. this.lilmenupanel.addMenuItem("Portfolio","Mi trabajo",this.destroyMe)
  24. //puedo alinear el texto animado con "right" o "bottom"
  25. this.lilmenupanel.alignment="bottom"
  26. //una vez que termino de añadir items, puedo mostrar el menu
  27. this.lilmenupanel.renderMenu()

El siguiente es un ejemplo un poco mas complejo, donde creo y destruyo un menu secundario

Bajar el codigo fuente: dando click aqui.

En el post anterior mencionaba el sitio de Sean Kennedy Santos. Pues bien, estaba jugando en flash, y el resultado fue un menu parecido al de ese sitio.

Se basa en tres clases: menupanel (que controla el menu en general), menuitem(que corresponde a cada boton del menu) y typewritter (que es una clase para animar el texto)

Para hacerla funcionar, primero arrastro mi movieclip de menu al stage. Luego, añado las siguientes lineas de codigo:

Actionscript:
  1. //defino el texto que el menu tiene por default
  2. this.lilmenupanel.mainlabel="blog.innocuo.com"
  3. //anado items al menu, al momento son solo dos parametros: titulo del boton, y descripcion
  4. this.lilmenupanel.addMenuItem("Home","01 Home")
  5. this.lilmenupanel.addMenuItem("Contact","02 Contact")
  6. this.lilmenupanel.addMenuItem("Portfolio","Mi trabajo")
  7. //una vez que termino de añadir items, puedo mostrar el menu
  8. this.lilmenupanel.renderMenu()

el metodo addMenuItem me permite agregar botones a mi menu, con dos parametros: el texto del boton, y la descripcion (que es la que se va a animar)
Una vez que termino de añadir items a mi menu, lo renderizo con el metodo renderMenu.

Este es solo un ejemplo, los botones no estan habilitados para realizar accion alguna (talvez siga costumizando este menu para hacer una especie de componente).

Bajar el codigo fuente: dando click aqui.

Dos sitios de group94

Junio 4th, 2005

Como siempre, los sitios de Group94 son impresionantes. Esta vez nos traen los sitios de Albrecht Gerlach y Sean Kennedy Santos. Ambos son portfolios de fotografos. La navegacion de estos sitios, como siempre, muy original. Me agrado la forma de navegar los "thumbnails" del sitio de Albrechtgerlach.com. Vale la pena chequearlos