Bitbloq Apps es una herramienta de BQ Educación para crear aplicaciones móviles en iOS y Android. Se puede acceder desde https://bitbloq.cc, pulsando "Nuevo documento" y seleccionando "Bitbloq Apps".
Para guardar y modificar proyectos, es necesario registrarse.
Para ello elegimos la opción de !Entrar a Bitbloq! (botón de la esquina superior derecha)
Hacemos login con nuestra cuenta de Google, ponemos nuestro año de nacimiento y cómo conocimos la aplicación y nos permite entrar a crear nuestro nuevo documento y al haber hecho login, podremos guardar y modificar nuestros proyectos.
Interfaz: La herramienta tiene tres pestañas principales: Diseño, Bloques e Información del proyecto, para diseñar la interfaz, programar y añadir detalles al proyecto.
- Barra de herramientas: Permite gestionar el documento (nombre, descarga, nuevo proyecto) y cambiar entre modo básico y avanzado.
- Pantallas: Permite añadir pantallas y gestionar su contenido.
- Visor: Espacio para previsualizar la interfaz.
- Componentes: Lista de elementos que se pueden añadir, divididos en categorías.
- Propiedades: Modifica las propiedades de los componentes.
- Componentes añadidos: Muestra todos los componentes incluidos en la aplicación.
- Recursos multimedia: Permite añadir imágenes, vídeos, sonidos, etc.
- Espacio de programación: Zona para crear la lógica de la aplicación. Incluye pestañas como pantallas, variables, listas y funciones.
- Bloques de programación: Lista de bloques organizados en categorías para estructurar el código.
- Botón Prueba la app: Permite previsualizar la aplicación en dispositivos móviles o desde la web.
Para desarrollar una aplicación con Bitbloq Apps, se siguen dos pasos principales:
- Diseñar la interfaz arrastrando y colocando componentes necesarios.
- Programar el funcionamiento usando bloques en el espacio de la pestaña "Bloques". Las programaciones se estructuran en columnas o filas.
La programación está basada en eventos, es decir, se define qué acciones desencadenan determinadas programaciones. Por ejemplo:
- Botón: Configura acciones como clic, doble clic, etc.
- Imagen: Puede iniciar una programación al pulsarse.
- Deslizador: Detecta cambios de posición.
- Desplegable: Responde a selecciones.
- Interruptor: Similar al deslizador, pero con estados binarios.
Vamos a hacer una Editor de texto (muy simple) para aprender a utilizar estos conceptos
Esta práctica consiste en crear un pequeño editor de texto donde se pueda modificar el contenido del mensaje, su tamaño y si está en negrita, usando diferentes eventos.
Pasos para programarlo:
- Añadir componentes:
- De la categoría Básicos, incluye un componente Texto y un componente Botón.
- De la categoría Formulario, añade un Entrada de texto, un Selector desplegable y un par de interruptores.
- Añadimos un segundo componente de Texto para la etiqueta del segundo interruptor (la que en la imagen dice "Poner azul")
- Programar el botón:
- Configura que, al pulsarlo, el texto del componente Texto cambie al valor introducido en el componente Entrada de texto.
- Añadir condicional:
- Usa un condicional Si_Ejecutar de la categoría Control para que el texto pase a estar en negrita dependiendo del estado del Interruptor.
- Hacemos lo mismo con el segundo interruptor para cambiar el color del texto
- Configurar el tamaño del texto:
- Usa condicionales para ajustar el tamaño del texto según el valor seleccionado en el Selector desplegable. Define las opciones correspondientes dentro del componente. (“Pequeño”, "Normal" y “Grande”)
- Prueba la aplicación:
Usa Bitbloq Pocket para verificar su funcionamiento.
Te adjunto a continuación la programación de los componentes.
Aquí tienes también la captura de pantalla del código QR para que puedas comprobar en el móvil el funcionamiento de la aplicación, tanto en IOS como en Android
Para sacar el código QR (o probar la aplicación en tu ordenador) sólo tienes que desplegar el botón de prueba de la App (el que está en la esquina superior derecha de la pantalla (lo hemos localizado con el número 10 en la lista anterior donde explicábamos la interfaz de programación)
Como ves es muy sencillo empezar a desarrollar aplicaciones para móviles con esta aplicación web.
Esta entrada del bloq está inspirada en la documentación de los libros de Anaya Educación para la asignatura de Computación y Robótica de la ESO en Andalucía con el propósito de ayudar a los estudiantes a empezar en este mundillo de la programación.
Si no conocías la serie de libros de Anaya de la colección eduDYNAMIC para el curriculum de Computación y Robótica, te recomiendo que contactes con su comercial y pidas acceso al material, son muy recomendables para tus clases y totalmente adaptados a la nueva legislación.
