DESCARGAR EJEMPLO | VER EN GRANDE

 

En el ejemplo de hoy, voy a complacer a Pilar, de Ecuador, y cambiaré el contenido que explicaba cómo cambiar de cursor, por un ejemplo que muestra como hacer ejercicios de matemáticas, sumas, restas, multiplicaciones...

No puedo desarrollar toda una aplicación de sumas, restas y multiplicaciones como me pedía Pilar, más por falta de tiempo para explicarlo (el desarrollo no es muy complicado) que por ganas, pero si puedo indicarle las bases y pistas para que ella u otros desarrolladores puedan coger el desafío y realizar contenidos educativos como este.

Flash es una herramienta de autor excelente para realizar contenidos multimedia para escuelas. Aunque si no estais familiarizado con Flash y os interesan otras opciones, os recomiendo las siguientes:

http://www.acruxsoftware.com/xbuilder/index.php
http://www.supercard.us/
http://revolution.runrev.com/
http://dreamcard.runrev.com/section/platform.php
http://www.realsoftware.com/

En este ejemplo, veremos cómo hacer sumas, pero lo vamos a programar de manera que sea muy sencillo hacer operaciones de varios dígitos y que podamos crear una herramienta de restas, multiplicaciones... rapidamente.

 

Cambiar de cursor

Como el código de cambiar el cursor es muy sencillo, lo pongo aquí y lo explico brevemente (sacado de la ayuda de flash)

Para crear un puntero personalizado:

1.- Crear un clip de película para utilizarlo como ratón y colocar una instancia del objeto en el escenario.
2.- Seleccionar el clip de película.
3.- Seleccionar Ventana > Paneles de desarrollo > Acciones para abrir el panel Acciones en el caso de que no aparezca en pantalla.

En este panel, escribir lo siguiente:

onClipEvent (load) {
Mouse.hide();
startDrag(this, true);
}

onClipEvent(mouseMove){
updateAfterEvent();
}

El primer controlador onClipEvent() oculta el ratón (por defecto) cuando el clip de película aparece por primera vez en el escenario. Al mismo tiempo, comienza a arrastrar el objeto que queremos utilizar como ratón (startDrag) y lo centra en lo que sería nuestro ratón (true).

"La función updateAfterEvent actualiza la pantalla inmediatamente después de que se haya producido el evento especificado, en lugar de cuando se dibuja el fotograma siguiente, que es lo que suele ocurrir."

 
   

 

 
   
Crear y colocar los elementos

Lo primero que haremos es crear y colocar los diferentes elementos que vamos a necesitar, en nuestra pantalla. Como en otras ocasiones, dividiremos en capas los elementos para tenerlos ordenados. Como son pocos, en este caso, tendremos una capa para los botones y textos, una capa para las acciones y otra para los fondos.

En la capa de objetos, crearemos los textos:

Arriba del todo, pondremos un campo de texto estático con la frase "Operaciones matemáticas (SUMAR)" o la que deseemos.

Campo de texto, de tipo Dinámico.
En el apartado Var (variable), pondremos como nombre de variable num1.
Aquí aparecerá la primera cifra a sumar.

Campo de texto, de tipo Dinámico.
En el apartado Var (variable), pondremos como nombre de variable num2.
Aquí aparecerá el segundo valor.

En medio de los dos campos, pondremos un signo + (cambiándolo si hacemos restas o multiplicaciones...)


Campo de texto, de tipo Introducción de texto.

Este campo de texto, nos servirá para introducir nuestro cálculo. En la casilla de Instancia (izquierda), pondremos como nombre, respuesta. De esta manera podremos controlar el campo de texto.

En la parte derecha, en la casilla Var, pondremos rdo. y en la parte derecha e inferior dónde pone Número máximo de caracteres, pondremos 8. Con esto, limitamos el número de letras que caben en el campo a 8.

Botón. Al pulsar el botón, validaremos el resultado. El botón puede ser cualquiera que tengamos en la biblioteca o cualquier objeto que insertemos en flash, convirtiéndolo a objeto botón.


Campo de texto, de tipo Dinámico.
En el apartado Var (variable), pondremos como nombre de variable intentos.
Este campo almacenará las veces que pulsamos el botón para comprobar el resultado, es decir, el número de intentos.


Campo de texto, de tipo Dinámico.
En el apartado Var (variable), pondremos como nombre de variable aciertos.
Este campo almacenará las veces que hemos acertado la operación.


Campo de texto, de tipo Dinámico.
En el apartado Var (variable), pondremos como nombre de variable fallos.
Este campo almacenará las veces que hemos fallado la operación.


Acciones

En la capa de acciones, escribiremos el siguiente código (copiar y pegar):

stop();
var limite = 1000;
aciertos=0;
fallos=0;
intentos=0;
respuesta.restrict = "0-9";
//
function crea_operacion() {
num1 = Math.round(Math.random()*limite);
num2 = Math.round(Math.random()*limite);
rdo = "";
}
crea_operacion();
//
function comprueba_resultado() {
intentos = intentos+1;
if ((num1+num2) == rdo) {
aciertos = aciertos+1;
crea_operacion();
} else {
fallos = fallos+1;
}
}

En pantalla quedaría algo así:

La primera variable (var limite=1000), define cuántos dígitos queremos calcular. De esta manera, mostrará cifras de máximo tres dígitos. Si deseamos cifras más pequeñas, tendremos que reducir esta variable. Si ponemos limite=100, mostrará cálculos de dos dígitos, y si ponemos 10, nos pedirá sumas de 1 dígito.

La tres siguientes variables (aciertos, fallos e intentos) son las correspondientes a los campos de texto con el mismo nombre de variable. De esta manera, ponemos el valor inicial a 0.

La función de la línea 6 (respuesta.restrict="0-9";) hace que el campo respuesta (dónde escribimos el resultado de la operación), sólo admita números. De esta manera evitamos que por error alguien quiera escribir letras en el campo.

La primera función crea_operacion, crea los valores num1 y num2 (las dos casillas a sumar). Estos valores los crea aleatoriamente. Para ello utilizamos la función Math.random(), que crea un número entre 0 y 1, lo multiplicamos por el límite, en este caso 1000 y luego lo redondeamos con Math.round().

Por ejemplo La función random me da el valor 0.257579310797155. Este valor lo multiplicamos por 1000 y tenemos 257.579310797155. Si redondeamos, nos devolverá el valor 258.

Hay una función en flash, llamada random(), sin Math., que hace un número aleatorio con límite lo que pongamos entre paréntesis. Por ejemplo random(6) nos dará números del 0 al 5. Pero esta función está obsoleta y es probable que desaparezca en el futuro.

La segunda función comprueba_resultados, verifica si lo hemos hecho correctamente. Lo primero que hace es aumentar el número de intentos (intentos=intentos+1). Luego tiene un condicional (IF). Comprueba si la suma de num1 y num2 (num1+num2) es igual (==) al resultado (el campo de texto del resultado, tiene como valor de variable rdo). Si es así, el número de aciertos se incrementa en 1, y creamos una nueva operación que nos genera nuevos números.

Si no es así (no hemos calculado bien), el número de fallos se incrementa en 1 y volvemos a intentarlo con los mismos números.

Por úitimo, en el botón pondremos el siguiente código

on (press) {
comprueba_resultado();
}

Al presionar el botón, comprobaremos que la operación es correcta.

 

Y ya está...

Con esto y un poco de imaginación podemos hacer hasta una calculadora.

Si sustituimos num1+num2 por num1*num2, tendremos una multiplicación. Si sustituimos num1+num2 por num1-num2, tendremos una resta.

En el caso de división hay que tener más cuidado, ya que hay que calcular el valor resultante y el resto... para calcular la división se utiliza / y para calcular el resto de la división el signo ^.

Si queremos hacer operaciones fijas con un número (por ejemplo, la tabla del 3), siempre pondremos un valor fijo. Por ejemplo: num2 = 3;. Si ponemos esto en lugar del código que hay, las operaciones que hará serán siempre un valor multiplicado por 3.s

:)

 
 


 
   

Materiales del curso (Tutoriales anteriores)

ejercicio 7: Objeto Sonido
ejercicio 6: Operaciones matemáticas
ejercicio 5: Flash y javascript
ejercicio 4: Trabajo con Arrays
ejercicio 3: Pequeñas utilidades
ejercicio 2: Precarga/Galería de fotos
ejercicio 1: Cómo hacer un puzzle

Enlaces interesantes:
Materiales y códigos… una gran biblioteca (en inglés) para empezar
http://www.flashkit.com/index.shtml

En castellano
http://www.nomaster.com/
http://www.webexperto.com/flash/
http://www.lawebdelprogramador.com

Un genio con flash y bases de datos … un maestro
http://www.kadazuro.com/tutoriales/

Una gran sorpresa de este verano
http://www.e-tonilopez.com/after-hours/phpBB2/index.php

La comunidad Flash y de desarrolladores de código de Macuarium es muy útil para comenzar si eres maquero
http://www.macuarium.com/foro/

 
 


Este código, así como los ejemplos, gráficos que lo ilustran y comentarios,
se pueden copiar, distribuir, imprimir... citando la fuente y el autor.

© Miguel Angel Muras (Tak) para Faq-Mac