FLASH Y XML (I): INTRODUCCIÓN AL XML
FLASH Y XML (II):
ELEMENTOS BÁSICOS DEL XML
FLASH Y XML (III): PRIMERA CARGA DE UN DOCUMENTO XML EN FLASH
FLASH Y XML (IV): EXTRAER DATOS DE UN DOCUMENTO XML
FLASH Y XML (V):
GENERAR UN MENÚ A PARTIR DE UN XML
Lo primero que debemos hacer es generar un documento xml que guardamos con el nombre "imagenes.xml"
<?xml version="1.0" encoding="utf-8" standalone="yes"?>
<album>
<imagen>
<origen>foto001.jpg</origen>
<titulo>Esta es la foto 1</titulo>
</imagen>
<imagen>
<origen>foto002.jpg</origen>
<titulo>Esta es la foto 2</titulo>
</imagen>
<imagen>
<origen>foto003.jpg</origen>
<titulo>Esta es la foto 3</titulo>
</imagen>
</album>
Para añadir más imágenes al album tan sólo tendríamos que añadir nodos al documento xml . Así podríamos personalizar el xml a las necesidades de nuestro album.
El siguiente paso es crear los elementos necesarios en el escenario:
1.- En este ejemplo, he creado un documento de Flash con unas dimensiones de
250px x 350px.
2.- Creamos un clip de película vacío con el nombre de instancia "contenedor_mc" que
situamos en la coordenada 0,0 del documento.
3- Creamos dos botones, uno para avanzar y otro retroceder con los nombres "adelante_btn" y "atras_btn" y
los situamos en la parte inferior del documento.
4.- Creamos una caja de texto dinámico con el nombre de "titulo_txt" y
la colocamos justo arriba de los botones.
5.- Creamos una última caja de texto dinámico que utilizaremos
para saber en que posición del album nos encontramos. La llamamos "posicion_txt" y
la colocamos a la derecha de la del título.
6.- Ahora procederemos al Actionscript. Ya que hay bastante código, en esta primera parte del tutorial nos aseguraremos de cargar todos los datos del xml. Sobre el primer fotograma insertamos el siguiente código:
//Creamos una función para cargar el XML
function cargarXML(cargado) {
//Si el xml se ha cargado correctamente
if (cargado) {
//Creo una variable xmlNodo igual a this.firstChild,
//para reutilizarla frecuentemente y así facilitar el acceso al xml.
xmlNodo = this.firstChild;
//En las dos siguientes líneas declaro las variables
// imagen y descripcion como arrays para ir almacenando en ellas los accesos
//a las imagenes y los titulos de las mimas
imagen = [];
descripcion = [];
//Establezco el valor de total como el numero de "childNodes"
//que nuestro XML contiene.
//En nuestro caso el xml contiene 3 nodos hijo con lo cual adquirira ese valor.
total = xmlNodo.childNodes.length;
//Utilizo un bucle para ir llenando las arrays imagen y descripcion que he
//creado anteriormente
for (i=0; i<total; i++) {
imagen[i] = xmlNodo.childNodes[i].childNodes[0].firstChild.nodeValue;
descripcion[i] = xmlNodo.childNodes[i].childNodes[1].firstChild.nodeValue;
}
//Hago un trace de las array imagen y descripcion. //Lo cuál nos devolverá todas //las imagenes y titulos de nuestro documento xml
trace(imagen)
trace(descripcion)
} else {
trace("algo ha fallado");
}
}
//Creamos un nuevo objeto XML
xmlAlbum = new XML();
//Ignoramos los espacios en blanco del xml
xmlAlbum.ignoreWhite = true;
//En la carga llamamos a la funcion cargarXML para asegurarnos que la carga
//se efectua con exito
xmlAlbum.onLoad = cargarXML;
//cargamos el documento XML
xmlAlbum.load("imagenes.xml");
En este punto y probando la película (CTRL+INTRO) deberán aparecer todas las imagenes y los títulos que hayamos puesto en nuestro documento XML mediante los "trace" insertados en el Actionscript.