Objetivo:
Crear una aplicación que reste dos números haciendo uso de dos pantallas, una para introducir los números a restar y la otra para mostrar el resultado.
Descripción:
- Abrir un nuevo proyecto y asignarle como nombre "restanumeros".
- En el área de diseño incorporar una la etiqueta a la que le incluye el titulo de la aplicación "Resta DOS Números:" personaliza las propiedades a tu gusto.
- Agregar un HorizontalArrangement, con las siguientes características:
- alineación centrada,
- ancho 320 Pixeles y
- Altura 70 Pixeles.
- En ese horizontalArrangement, se agregan 3 etiqueta, una para el primer número, otra para el Signo y la tercera para el segundo número
- Adicionalmente agregamos un Botón con texto calculo.
- En la siguiente imagen se muestra la interfaz creada
Una vez realizado el diseño de la pantalla 01, agregamos una segunda pantalla y en ella elaboramos el Diseño siguiente:
- Se incorporan dos etiquetas y un Botón.
- En la Etiqueta 01 digite como texto "El resultado obtenido es:"
- En el Botón se incluye el texto "atrás o anterior".
- Ahora vamos a construir los blogs para la pantalla01
- Nos posicionamos en la pantalla 01 y seleccionamos bloques para construir los bloques de esa pantalla conformada por dos bloques
- Primer Blog, declara una variable global para el resultado, para ello vas a Built-in en el panel de la izquierda y eliges la categoria variable y seleccionamos initialice global name
- En name, incluimos el nombre de la variable en mi caso resultadoresta, donde dice to se debe de inicializar con 0, para ello va a built-in y en categoría matemáticas elige 0
- Ahora vamos a crear el blog para cuando se da clic sobre el botón se debe de realizar el calculo(resta) de los dos números
- Seleccionamos el botón en el panel izquierdo y nos aparecen bloques referentes a ese botón
- El elegimos When name(nombre del botón) Click
- Dentro de este debemos de restar los dos números para ello vamos a seleccionar la categoría de bloques de matemáticas y ahí seleccionamos resta, en resta nos pide dos números que son los nombres de los label que contienen los números a restar.
- Adicionalmente dentro del blog del botón, también debemos de mostar el resultado en la pantalla 02.
- Vamos a control y seleccionamos el blog "open and other screen wwith start value
- para asignar el nombre de la pantalla02 seleccionamos la categoría de texto y ahí seleccionamos el primer blog " ", en donde introducimos Screen2 y donde dice startValue agregamos el nombre de la variable declarada como global resultadoresta.
- Listo ya tenemos los blogs de la pantalla01
- Agregar los blogs de la pantalla 02:
- Seleccionamos la pantalla2 Screen2) estando en Bloques, desde Built-in, y despliega la cantidad de blogs permitidos para ese objeto, seleccionamos el siguiente blog
- En do agredamos el nombre de la variable resultadoresta y desde control seleccionamos get start value
- El blog para el botón que se devuelve a la pantalla 01, se utiliza la categoría control y ahí se obtiene el blog When name(nombre del botón) Click y en do agrega el blog screen name y le asignamos como texto Screen1
Ahora podemos probar la aplicación, para ello se posiciona en screen1, vas a la opción del menú conect y eliges el medio por el que desea ejecutar la aplicación
Las siguientes imágenes muestran la emulación del celular:
Imagen 1
Imagen 2
Al dar clic al botón calcular de la pantalla 01, muestra el resultado a como lo ilustra la imagen 2
Imagen 3
Cuando se da clic en el botón anterior de la pantalla2, el emulador despliega pantallas que se muestran en la imagen 3
El emulador en mi caso, con el equipo que tengo 2 Gigas de Ram y un procesador intel core 2 duo, es un poco lento.
Imagen 1
Esta es la primer pantalla en donde se introducen los números a restar, al hacer clic sobre el primer numero, despliega el teclado.
Al dar clic al botón calcular de la pantalla 01, muestra el resultado a como lo ilustra la imagen 2
Imagen 3
Cuando se da clic en el botón anterior de la pantalla2, el emulador despliega pantallas que se muestran en la imagen 3
El emulador en mi caso, con el equipo que tengo 2 Gigas de Ram y un procesador intel core 2 duo, es un poco lento.
Espero la disfrutes











Al realizar el ejemplo anterior en app inventor, se puede observar que hacer las interfaces de diseño es relativamente facil, lo que da algunos problemas es el emulador de android. Tambien hay que tomar en cuenta que los bloques esten bien para que la aplicacion funcione con exito.
ResponderEliminarAl final estos son los resultados:
Interfaz principal
https://drive.google.com/file/d/0B0M50yc2_KTMY2xUa0NpQUYxVU0/view
Indroduccion de los datos
https://drive.google.com/file/d/0B0M50yc2_KTMakpYTUxZTlZjN1E/view
Resultado de la resta
https://drive.google.com/file/d/0B0M50yc2_KTMLUh3Z1dUNWpYRmc/view
Resulta al presionar el boton anterior
https://drive.google.com/file/d/0B0M50yc2_KTMeXUwS0dNR0c0SVk/view
En conclusion, el app inventor es muy facil de usar y mas si son ejemplos pequeños como el anterior, con un poco mas de investigacion y practica, cabria la posibilidad de hacer aplicaciones mas grandes e interezantes.