sábado, marzo 08, 2008

Menu Flash con XML y FlashVars

Recientemente para mi trabajo he tenido que hacer parametrizables muchos de los flash que realizo día con día por motivos de ineficiencia.

Así por ejemplo, realizaba un menú según me lo piden, digamos con 4 links de texto, cada botón por dentro tiene la función de as2 getURL() con un string dentro que seria la url a la pagina ASPX que tiene que desarrollarse


mi_btn.onPress = function(){
getURL("mi_pagina.aspx")
}

entonces yo programaba todos los botones de esta manera esperando a que en el momento de desarrollarse la pagina, realmente se llamara "mi_pagina.aspx". En ciertas ocasiones, era cierto, pero en otras, se mandaba a realizar una modificación muy grande en la pagina, por lo que requeria otro nombre por que la anterior se guardaba como respaldo, entonces me enviaban de nuevo el flash, para hacer una modificación tan pequeña, que realmente no requería mi mano; pero asi era.

Ser programador significa automatizar procesos, yo también digo que nos motiva la vagancia de no estar haciendo lo mismo, pero en todo caso esto funciona.


Asi que idee lo siguiente, tomando en cuenta que se puede pasar parámetros desde el html hacia el flash, pensé que se pueden mandar los links de los botones del flash por parámetro, y así no tener que recompilar si hay un cambio en el link.

Pero en lugar de mandar n parámetros a un flash, solo mandamos uno, y por dentro dividimos los links y los asignamos a cada boton del flash:

"http://google.com|http://yahoo.es"

aqui tenemos este string con dos urls separadas por el caracter or "|", por dentro del flash lo separaremos con el método de string split() que nos dará un array con cada url por separado

param value="id=http://google.com|http://yahoo.es" name="FlashVars"

id sera una variable que podremos usar dentro del AS del flash como si fuera una variable que hubiéramos declarado dentro.

y como AS2 permite hacer cosas que no permite otro lenguaje podemos hacer esto:

id = id.split("|")

asi id se le asignará un array resultado de dividir a si mismo en fracciones, y podremos usar a id desde id[0] hasta id[id.length-1], recorriendo un FOR esto es sencillo, y así sabiendo dentro de nuestro flash cuantos botones tenemos asignamos a cada uno de acuerdo al indice de estos el valor del string que se paso por FlashVars.

Cuando los datos son masivos, o provenientes de una base de datos, entonces usar FlashVars resulta poco practico, aunque no imposible, pero lo usaremos de otra manera. En lugar de pasar por flash vars los links, pasamos la ruta de un XML al que conozcamos su estructura, lo recorremos de forma adecuada y, aprovechando que es un XML, podemos no solo mandar los links, sino los labels de cada botón, así nuestro menu seria completamente dinámico. Como ejemplo les muestro este menú que desarrolle en mi trabajo que lee un XML y que por flashvars recibe la url de donde se encuentra este XML










el flash pueden descargarlo aqui, y el xml de ejemplo aqui.

En el jscript que provee adobe con el nombre de AC_RunActiveContent.js, para pasar flashvar simplemente se agrega un parámetro mas al final de todos los que ya se encuentra recibiendo este método

'flashvars', 'id=menu_dinamico.xml'


El swf solo lee hasta un segundo nivel de nodos de xml


Menu SWF con XML
XML con la estructura que necesita el flash

5 comentarios:

Keysmaker dijo...

Hola Hola! Como va todo por acá! Tu blog está bastante interesante, muy bien surtido y con contenido realmente útil y curioso, es difícil ver cosas así ahora!

Buen trabajo y que sigan los post provechosos!

Anónimo dijo...

Hola che justo lo que buscaba, ahora te consulto: el swf q pones en el blog se ve y anda joya, pero el link q dice: " Menu SWF con XML " carga todo roto.

gracias por los tips!

Absulit dijo...

es cierto voy a hacer la correccion, el link es este realmente

http://mx.geocities.com/absulitnow/menu_xml.swf?id=menu_dinamico.xml

Realmente podria hacer una nueva version, ya que esta está desactualizada y lo podria hacer en as3, mejor explicado para todos, esperen nuevos post

Gracias por el comentario y Saludos

Chorx! dijo...

ahi anda groso! yo recien arranco con el flash y la verdad que soy un queso jejeje es como muy entreverado.
Podrias postear el .fla o el codigo que iria en el action script? estube tratando de hacer lo que escribiste pero no pasa nada. ( si lo se soy un desastre)

gracias a vos es re importante lo q haces para los que no sabemos!

si te puedo dar una mano en premiere o after effects me avisas!


Pd: que velocidad de respuesta!!!

Absulit dijo...

Viejos estaria genial si quisieras unirte al blog y hacer unos tutos de edicion de video y efectos, en la pagina principal acabo de postear ayer, un tuto de XML (tiene unas erratas por el editor de html de blogger pero creo que puede servir),
si querés podés escribirme a admin@absulit.net y ahi acordamos para ver que necesitas aprender para hacerte unos tutoriales, que te parece?