Bienvenido(a), Visitante. Favor de ingresar o registrarse.
¿Perdiste tu email de activación?
Ingresar con nombre de usuario, contraseña y duración de la sesión

 
Búsqueda Avanzada

96889 Mensajes en 12263 Temas- por 3819 Usuarios - Último usuario: pinolero
 
Páginas: [1]   Ir Abajo
Imprimir
0 Usuarios y 1 Visitante están viendo este tema.
Autor Tema: Como hacer una calculadora? (Tutorial)    (Leído 2913 veces)
jwjunior
ZP User
*

ZP Points: 0
Desconectado Desconectado

Mensajes: 15
$0.00 Zollars

Inventorio
Enviame Dinero
Photoshop con estilo!


Ver Perfil
« en: Julio 02, 2006, 05:01:12 »

bueno muchachos, saludos a todos.


Bien, es un pequeño sistema de calculadora que te puede ser muy util para hacer para tu pagina. Si eres un tanto ocioso y te gusta invertir tiempo en aprendizaje flash, que esperas para leerlo.


bien, lo primero que necesitamos es una imagen de una calculadora. Para esto, he usado una imagen de la calculadora por defecto que trae Windows XP.




bien, ahora lo que hacemos es un rectangulo al rededor de la calculadora. Esto lo hacemos para tener la medida exacta de la tecla y poder hacerlas todas.




bien, ahora seleccionamos el cuadro azul y vamos al menu modificar > Convertir en simbolo. O para hacerlo mas rapido, simplemente lo seleccionamos y le damos F8.

bien, ahora elegimos un nombre, en este ejemplo yo elegi el nombre "Boton_7". Porque es la tecla que corresponde al boton con el numero 7. Bien, despues de esto procedemos a elegir el diseño de la tecla, en esta parte no infiero mucho porque trabajar con botones en sencillo, es puro diseño y ya.



Solo recuerda (acotacion para principiantes), 'Reposo' es lo que nos muestra siempre, 'sobre' es cuando posamos el puntero sobre el boton, 'presionado' es cuando le damos click y lo tenemos sostenido, 'zona activa' es la parte del boton que me va a hacer activarlo.



Bien, repetimos la accion de crear boton en todas las teclas, desde el 0 al 9, incluyendo tambien la comilla (que en este ejemplo sera solo de relleno), la suma, resta, multiplicacion y division. Y la tecla c, que nos sirve para borrar la info que este en nuestro cuadro de texto. Bien, si hacemos todo correctamente nos quedara algo mas o menos asi:




Bien, despues de eso vamos a crear la pantalla. Para eso, elegimos la opcion texto de la barra de herramientas:




Y hacemos una seleccion en nuestra pantalla que tenemos en dibujo. Observa el pantallazo para entender mejor:




bien, despues de haber insertado el campo de texto, lo que hacemos es elegir la opcion de 'campo dinamico' y le ponemos por nombre pantalla. Para el que no sepa como hacerlo, en la siguiente imagen muestro como:





Bien, ahora lo que hacemos es meterle codigo actionscript a cada uno de nuestros botones.

Como mencione anteriormente, el boton de la coma (,) para numeros decimales, no la vamos a usar todavia. Asi que vamos con el resto.

Primero vamos a definir nuestros numeros. Es decir, vamos a dar la opcion que cada uno de nuestros numeros, al hacerle click se introduzca en nuestro campo de texto. Para esto, seleccionamos el numero cero (0) y en la parte donde dice 'Acciones - botón' introducimos este codigo:

Código:
on (release){
pantalla.text = pantalla.text + [color=Red]0[/color]
}

Bien. Ahora seleccionamos el numero uno (1) y hacemos lo mismo que en el anterior caso. La diferencia, es que no colocaremos 0 (cero) sino que colocaremos 1 (uno). Es decir, el numero en rojo lo cambiamos por el respectivo numero de su tecla.

Bien, hacemos el mismo procedimiento con los numeros del 1 al 9.


Ahora vamos a programar el boton de borrar. Para eso lo seleccionamos, vamos a la seccion de 'acciones' e insertamos este codigo:

Código:
on (release){
pantalla.text = ""
}

Este codigo significa, que nos va a dejar la pantalla con parametros nulos, es decir, sin nada.


Bien, ahora vamos a programar los operadores matematicos. Para ello, elegimos la division. Vamos a la seccion de 'acciones' e insertamos este codigo:

Código:
on (release){
valor1 = pantalla.text
pantalla.text= ""
operacion = "[color=Red]/[/color]"

}

Listo... Tenemos listo nuestra opcion de dividir. bueno, lo mismo vamos a hacer con la multiplicacion, suma y resta. Para eso, hacemos lo mismo que hicimos para dividir.

Solo que, en este caso, lo que esta seleccionado con rojo lo cambiamos de esta manera:

Para multiplicacion, le colocamos un asterisco (*)
Para suma, el simbolo de suma (+)
Para resta, el simbolo de resta (-).


Listo.



Para finalizar, debemos programar nuestro boton de igual.

Sencillo. Solo tenemos que elegir nuestro boton de igual, e introducir este codigo en la seccion de acciones:

Código:
on (release){
valor2 = pantalla.text
if (operacion == "/"){
pantalla.text = int(valor1) / int(valor2)
}
if (operacion == "*"){
pantalla.text = int(valor1) * int(valor2)
}
if (operacion == "+"){
pantalla.text = int(valor1) + int(valor2)
}
if (operacion == "-"){
pantalla.text = int(valor1) - int(valor2)
}

}


Listo. Ahora dale exportar, como swf o simplemente dale F12 y pruebas tu script.

Si lo haces bien, te debe quedar asi:

http://img261.imageshack.us/my.php?image=final3cl.swf

Saludos Wink


En línea
Christian_Mendez
Visitante
« Respuesta #1 en: Julio 02, 2006, 06:54:53 »

Esta bien hecho por ahora No lo voy a practicar no le veo uso... Tongue
Algún dia seguro que si...Gracias
En línea
Carlos
2 años
Administrador
ZP xTreme
*****

ZP Points: 17
Desconectado Desconectado

Sexo: Masculino
Mensajes: 2838
$775.29 Zollars

Inventorio
Enviame Dinero

x


Ver Perfil WWW
« Respuesta #2 en: Julio 02, 2006, 07:03:20 »

Muy bueno el tutorial Grin


Esta bien hecho por ahora No lo voy a practicar no le veo uso... Tongue
Algún dia seguro que si...Gracias
El uso es que aprendas AS y Flash >.<
En línea

jwjunior
ZP User
*

ZP Points: 0
Desconectado Desconectado

Mensajes: 15
$0.00 Zollars

Inventorio
Enviame Dinero
Photoshop con estilo!


Ver Perfil
« Respuesta #3 en: Julio 02, 2006, 11:53:43 »

Claro!

La idea es que la gente aprenda bases de Flash... Que vayan aprendiendo el lenguaje dinamico y que se den cuenta que no es tan dificil como lo pintan en las peliculas.


Mas adelante tratare de poner mas trabajos hechos por mi Wink
En línea
[ZP] Enrique GutBarr
As Roma
Administrador
ZP xTreme
*****

ZP Points: 104
Desconectado Desconectado

Sexo: Masculino
Mensajes: 3228
$288.00 Zollars

Inventorio
Enviame Dinero
LIVE FROM ZP


Ver Perfil WWW
« Respuesta #4 en: Julio 03, 2006, 12:00:32 »

Esta muy bien jwjunionr se agradece muchisimo este aporte haber cuando retomo flash y pongo a practicarme  Wink
En línea

- ·3D TexT -

It's their fault they don't have their money in the bank! xD

- LATEST  TUTORIALS -
[COLORWARE TUTORIAL] - [DEFINE YOUR LIFE TAG TUTORIAL] - [TECH ADDONS] - [3D TEXT]
---------------------------------------------------------------
- GIFTS 2008 -
X
(Busco Staff para el foro)
Spoiler:  PREMIESITOS (click para mostrar)
.subzero
ZP Lord
*****

ZP Points: -5
Desconectado Desconectado

Sexo: Masculino
Mensajes: 1330
$0.00 Zollars

Inventorio
Enviame Dinero

capo el chabon


Ver Perfil
« Respuesta #5 en: Julio 03, 2006, 06:49:25 »

capaz q lo haga, pero con un diseño mio de calculadora xD
En línea







FLÁÁÁSHH


 Platano

SZ SHOP
-----
AYUDAR A SUBZERO
RodriK
ZP Addicto
**

ZP Points: 0
Desconectado Desconectado

Sexo: Masculino
Mensajes: 97
$0.00 Zollars

Inventorio
Enviame Dinero

CyberArts Labs®


Ver Perfil
« Respuesta #6 en: Julio 03, 2006, 08:21:23 »

al parecer conoces harto de flash. Me gustaria hacerte un par de preguntas referente al tema (los publicare como temas nuevos)

Gracias
En línea

Páginas: [1]   Ir Arriba
Imprimir
Ir a: