Juegos_2

5/21/2018 Juegos_2

1/11

Juegos 307

Un juego de Trivia con ActionScripts y XML

Flash nos permite realizar juegos de trivia de una manera muy sencilla y con muchasvariaciones en estos juegos. Las preguntas por lo general cubren varios temas. Esta apli-cacin podra ser til en la enseanza remota o e-learnig, ya que, mediante un poco decdigo ms, podemos efectuar una base de datos con las calificaciones de los alumnos.Esta es slo una versin simplificada.

Usted puede hacer este juego de Trivia tan complejo como quiera. Existen algunoscon animaciones muy complejas para indicar una pregunta correcta o incorrecta. El ar-chivo XML tambin est muy simplificado, pues slo tiene 20 preguntas y consta de unsolo tema. De hecho, la mayora del cdigo est tomado de otro juego de Maratn. Estetutorial lo dividiremos en la explicacin del escenario, luego pasaremos a los smbolosy objetos grficos. Por ltimo los actionScripts, con la referencia al archivo XML.

El escenario

Este juego est dividido en dos escenas: en la primera se explican las reglas de juego(escena INICIO) y en la segunda, llamada Main. En esta escena tenemos dos fotogra-mas: uno para el juego y el siguiente para los resultados.

En la parte superior se tiene el tablero para las preguntas y sus posibles respuestas.En la parte media del escenario, sirve para desplegar los resultados, ya sea que la

pregunta se conteste de forma correcta o no.Como puede observar, en la parte inferior, tenemos una especie de marcador que

contabiliza los aciertos y las fallas, as como el nmero de preguntas de la trivia y el n-mero de la pregunta efectuada.En el siguiente fotograma se tiene el resultado del juego si se gan o no.

Smbolos y Objetos grficos

Tampoco se tienen en el juego muchos smbolos u objetos grficos, salvo los botonesque los tom de la biblioteca propia del paquete. Hay tambin varios textos dinmicospara el marcador y uno ms para el resultado final. No hay muchos ms smbolos.

Smbolo Tipo

Botn Respuesta Botn

Botn Contina Botn

MyBuenas Dinamic Text

MyMalas Dinamic Text

MyResultado Dinamic Text

5/21/2018 Juegos_2

2/11

Archivo XML

El XML es un lenguaje similar al HTML, de hecho se desarrollcomo una extensin(eXtended Markup Lenguage). El archivo de las preguntas tiene el siguiente formato:

308 Programacin en Flash MX 2004

Cual es la capital de Francia

Orly

Paris

Evry

2

1

.

.

.

Por alguna extraa razn (al menos con la versin que yo manejo), Flash slo reconocetexto seguido.

0Cual es la capital de Mexico-

Guadalajara

MonterreyDistrito Federal

3

11Cual es la capital de

Espana BarcelonaMadrid

Granada212

Cual es la capital deetc

El XML no reconoce acentos, ni ees. Para eso hay que utilizar ciertos caracteres de control.

Letra Secuencia

""

""

""

""

""

""

5/21/2018 Juegos_2

3/11

El archivo lo puede hacer con cualquier procesador de palabra, slo hay que salvarlosin caracteres especiales y con la extensin XML. Si le apasiona este tema, puede con-sultar cualquier libro de referencia (que seguramente pesarms que un recin nacido).

Juegos 309

Figura 1

ActionScript

Las rutinas son muy sencillas. La mayora del cdigo se encuentra en la escena deInicio y de los dems puntos solamente se llaman como rutinas. El siguiente cuadronos ayudar:

5/21/2018 Juegos_2

4/11

Variables y constantes de inicio

Aques donde definimos las constantes que utilizaremos a lo largo del juego: las variablespara controlar las respuestas buenas y malas, y el arreglo donde se leern las pregun-tas del archivo XML.

Es importante detenernos en las variables de XML Primero se crea un objeto deltipo XML, luego se abre el archivo XML (ojo, debe de estar en la carpeta adecuada), yluego, con la instruccin objetoXML.onLoad, se ejecuta la funcin marcada, en este ca-so la funcin cargaXMLque explicaremos ms adelante:


Rutina Ubicacin

Rutina de Inicio Escena Inicio

Funcin pregunta Escena Inicio

CargaXML Escena Inicio

BuscaPregunta Escena Inicio

Evala Escena Inicio

PrximaPregunta Escena Inicio

Lanza respuesta Botones de respuesta

Reinicia Juego Botn de reinicio

/**************************************************************/

var bueas = 0; //Contador de las buenas

var malas = 0; //Contador de las malas

var numPreguntas=0; //Se lee del XML

var correcto = 0; //Se lee del XML

var META=10; //Km para finalizar

var todasLasPreguntas = new Array(); //Guarda las preguntas del XMLvar respuestaCorrecta = ;

var contadorPregunta = 1;

myTotal = META;

myPregunta = contadorPregunta;

/**************************************************************/

var aimlXML = new XML(); //Objeto XML

aimlXML.load(preguntas.xml); //Lee archivo XML

aimlXML.onLoad = loadedXML; //Al terminar, ejecuta funcion

5/21/2018 Juegos_2

5/11

Crea el objeto predefinido pregunta

Dentro de esta estructura guardaremos las preguntas del archivo. Como es un archivono muy grande, lo podemos hacer para simplificar el manejo del XML.

Juegos 311

function pregunta(p1, p2, p3, p4, p5, p6){

this.numero = p1; //Numero de pregunta

this.texto = p2; //Texto de la pregunta

this.op1 = p3; //Opcion 1



this.correcto = p6; //Opcion correcta

this.ya = 0; //0 no ha sido preguntado, 1 ya

fue

}

/**************************************************************/

Funcin cargaXML

Aques donde comienza la diversin. En la variable allTextse carga todo el archivocomo una serie de caracteres sin delimitadores. En la variable ase almacenarel pri-mer nodo, en este caso, la primera pregunta. Con la funcin objetoXML.childNode, se

crea un vector con cada uno de los nodos, es decir, cada nodo tiene un bloque de pre-gunta completa, con todas las etiquetas y sus nodos. Como ya es un simple vector oarreglo, la siguiente instruccin nos indica cuntas preguntas hay en el archivo, por loque ahora barreremos cada una de las preguntas, y las vaciaremos en los objetos crea-dos pregunta, que son ms sencillos de manejar.

Dentro del ciclo, lo primero que hacemos es vaciar el valor del nodo otra vez conla funcin objetoXML.childNode, con lo cual ya tendremos cada uno de los nodos es-pecficos de la pregunta. Como puede observar, utilizamos variables temporales paraobtener el valor de cada uno de los nodos de la pregunta, que ya fueron explicados. El

siguiente paso es hacer otro vector de objetos preguntas. Ases muy fcil manejar el ar-chivo, pues ya lo tenemos prcticamente en forma matricial.La siguiente instruccin lee el siguiente nieto. En nuestro caso, la siguiente

pregunta... y eso es todo para lo que utilizaremos a XML. No es mucho, pero nossirve para un primer acercamiento a XML, y para tener un jueguito que lee un ar-chivo externo. Tambin se podran manejar arreglos (pero es poco dinmico, pueshay que rehacer la pelcula si se quiere modificar o agregar preguntas) o se puedeutilizar un archivo con variables, pero con esto al menos conocemos (aunque sea unpoco), de XML.

5/21/2018 Juegos_2

6/11

Como puede observar, se tiene un campo de kilmetros, el cual es herencia del juegode Maratn.

Funcin buscaPregunta

Esta funcin es muy sencilla. Solo vaca los valores de los objetos, dependiendo de

cada pregunta marcada la azar, en variables de trabajo, o en su defecto, en los textosdinmicos. Para ponerle un poco de sabor al juego, al enunciado de la pregunta le in-cluimos un efecto, donde las letras se desplazan de diferentes lugares. Utilizando estemismo formato, es decir, convirtiendo en un clip de pelcula a cada una de las letras, sepueden hacer muchos efectos interesantes. Note que las coordenadas son fijas. Necesi-ta un poco ms de cdigo para hacer dinmicas las ubicaciones. En otro tutorial sedetallaren efectos de texto.


function cargaXML(){

allText = preguntaXML.firstChild; //Lee todo el archivo

a = allText.firstChild; //Lee el primer nodo

arrayPreguntas = allText.childNodes; //Hace el array de pregun-

tas

numPreguntas = arrayPreguntas.length; //Evalua el no de preg. en

el archivo

for (var i=0;i

5/21/2018 Juegos_2

7/11

Funcin Evala

Esta funcin se ejecuta cuando el jugador ha respondido a la pregunta de la compu-tadora. La respuesta no es ms que el nmero de botn seleccionado, almacenado enuna variable. Si esta variable coincide con la respuesta almacenada en los archivos (lavariable correcto) se incrementa el contador de preguntas acertadas. Si no coinciden,se incrementa el otro contador. Tambin se evala si ya se realizaron todas las pregun-

tas y lanza una evaluacin de la trivia.

Juegos 313

function buscaPregunta(buscaPregunta){

cadenaPregunta = todasLasPreguntas[buscaPregunta].texto;

opcion1 = todasLasPreguntas[buscaPregunta].op1;

opcion2 = todasLasPreguntas[buscaPregunta].op2;opcion3 = todasLasPreguntas[buscaPregunta].op3;

correcto = todasLasPreguntas[buscaPregunta].correcto;

kilometros = todasLasPreguntas[buscaPregunta].kilometros;

if(correcto==1) respuestaCorrecta = todasLasPreguntas

[buscaPregunta].op1;





for (i=0;i

5/21/2018 Juegos_2

8/11

Funcin proximaPreguntaEl chiste de esta funcin es validar que la pregunta no haya sido utilizada, de lo con-trario, si su archivo no es muy extenso, es probable que una misma pregunta salga msde una vez. Por ello efectuamos un ciclo verificando que la pregunta no haya sido uti-lizada. Ojo: Sus preguntas deben ser suficientes para que este ciclo no caiga en un cicloindefinido, o puede aadir un poco de cdigo para evitar este problema.

Incrementa los contadores de preguntas contestadas correcta e incorrectamente.


} else {

malas++;

myEstado = Lo siento, la respuesta correcta es:

myRespuestaCorrecta = respuestaCorrecta;//Incrementa malas

gotoAndStop(Main,2);

}

if (contadorPregunta==META){

myEstado = Tu evaluacion es +buenas+ de +META;

if(buenas/META>.6) {

myRespuestaCorrecta = Felicidades;

} else {

myRespuestaCorrecta = Lo sentimos, tienes que repetir el

examen;}

gotoAndStop (Main,2);

}

//proximaPregunta(); //La que sigue

}

/**************************************************************/

/**************************************************************/

function proximaPregunta(){do {

iPregunta=random(numPreguntas); //Busca pregunta nuevecita

} while (todasLasPreguntas[iPregunta].ya==1);

todasLasPreguntas[iPregunta].ya=1; //La marca como ya hecha

buscaPregunta(iPregunta); //Busca pregunta

myMalas = malas;

myBuenas = buenas;

}

/**************************************************************/

5/21/2018 Juegos_2

9/11

Botn de respuesta

Lanza la funcin de evalua, vista anteriormente, con el nmero de botn seleccionado

Juegos 315

on (release) {

evalua(1);

}

Botn contina

Al finalizar el juego, ya sea que haya ganado o no, el botn para continuar limpia lasvariables y regresa al primer fotograma.

on(press){

for (i=0;i

5/21/2018 Juegos_2

10/11


Las letras

Como puede observar, se pueden variar los efectos de las letras para que se muevanaleatoriamente, de arriba a bajo, giren, etc. Como ya se dijo, en otro tutorial se detalla-rn los diferentes efectos. En este se maneja el nmero 2, donde las letras escogen unaposicin al azar y se colocan progresivamente en donde les corresponde.

onClipEvent(load){

if(this.efecto==2){

n = 0;

startx = Math.random()*550;

starty = Math.random()*100;

this._x = startx;

this._y = starty;

}

}

Figura 2

5/21/2018 Juegos_2

11/11

Juegos 317

Usted puede hacer tan complicado como guste este juego. Por medio de herramientascomo PHP, ASP o XLM podemos elaborar casi un sistema de e-learnig, donde el usuariose firma a la base de datos y las calificaciones se almacenan o se envan por correo elec-trnico.

onClipEvent(enterFrame){

if(this.efecto==2){

n +=5;

if(n

Juegos_2

Documents

Transcript of Juegos_2