3ESO-SA1-Desarrollo Móvil
Prácticas de Aplicación para Móvil con Thunkable
La dirección es: Página de acceso a Thunkable.
Si es la primera vez que la usamos, primero nos tenemos que registrar. Marcamos Sign Up
Si ya nos habíamos conectado antes, elegimos Log In
La mejor opción es entrar con un usuario de Google (o nos creamos un usuario nuevo).
Crear una aplicación con Thunkable:
Según le damos a Create New Proyect en la ventana inicial (después de entrar poniendo el usuario) y ponerle nombre a nuestro proyecto lo que vemos es esto:
FASE DE DISEÑO:
Tres zonas importantes:
- Selección de componentes: La del círculo color marrón a la izquierda. Aquí elegimos las cosas (componentes como etiquetas de texto, entradas de texto, botones, imágenes…) que queremos que salgan en la pantalla. Las cogemos con el ratón y las arrastramos a la Luego las colocamos en su sitio (es difícil atinar a la primera).
- Pantalla: La del círculo de color amarillo. Aquí es una presentación de cómo se vería. OJO, que no es exactamente cómo se vería, sino como se quedan los componentes colocados (los botones, los cuadros de texto, las imágenes) pero no los valores de los componentes, que pueden cambiar todo el rato (podemos cambiar el contenido de los Input, o marcar casillas, cambiar texto, cambiar fotos….).
- Características de componentes: La del círculo marrón de la derecha. Da la posibilidad de seleccionar las características del componente seleccionado.
Lo normal al crear una aplicación de este tipo es que primero arrastremos los componentes y luego los configuremos.
FASE DE PROGRAMACIÓN:
Al terminar con la fase de Diseño, daremos en la pestaña que puse rodeada de un círculo verde (Blocks) que es donde ponemos los códigos tipo Scratch que hacen que la interfaz funcione (o sea, que el programa aparte de parecer bonito, haga algo).
1. Crear un Nuevo Proyecto
- Ve a Thunkable y regístrate o inicia sesión.
- Haz clic en «Create New App».
- Ponle un nombre al proyecto, por ejemplo: «Hola Mundo».
2. Diseñar la Interfaz
- En la pestaña «Design»:
- Arrastra un Label a la pantalla. Este será el texto que cambiará de color.
- Cambia el texto del Label (por ejemplo: «Hola Mundo»).
- Arrastra un Button debajo del Label.
- Cambia el texto del botón (por ejemplo: «Cambiar color»).
- Arrastra un Label a la pantalla. Este será el texto que cambiará de color.
3. Programar con Bloques
Ve a la pestaña «Blocks».
Busca el evento del botón:
- «when Button1 Click» y arrástralo al lienzo de bloques.
Dentro de este evento:
- Busca el bloque «set Label1’s Background Color to» y colócalo dentro del evento.
- Haz clic en el recuadro de color para seleccionar el color que deseas (por ejemplo, azul, rojo, etc.).
Opcional: Si deseas cambiar el color del texto en lugar del fondo:
- Usa el bloque «set Label1’s Text Color to».
4. Probar la Aplicación
- Ve a la pestaña «Preview» o prueba tu app en un dispositivo móvil con la app de Thunkable.
- Haz clic en el botón y observa cómo cambia el color del Label.
Pequeño juego que consiste en adivinar un número que calcula el móvil.