Activa JavaScript para disfrutar de los vídeos de la Mediateca.
frontend conectar
Ajuste de pantallaEl ajuste de pantalla se aprecia al ver el vídeo en pantalla completa. Elige la presentación que más te guste:
Cómo hacer el frontend en App inventor para poder conectar el móvil con un placa zum de bq
Hola chicos, voy a subiros un par de vídeos para explicaros cómo conectar el móvil y la placa Zoom.
00:00:00
Voy a dividirlo en dos, uno para el front-end y otro para el back-end.
00:00:07
Empezamos por el front-end, en la página de App Inventor, en vuestro usuario, en la zona del diseñador.
00:00:11
Necesitamos poner primero qué vamos a utilizar.
00:00:21
Aquí ya acabo de sacar, voy a borrarlo.
00:00:24
sacamos un botón que vamos a utilizar para desconectar el móvil y la placa
00:00:27
y para conectarlo vamos a tener aquí que se vea otro botón
00:00:38
pero en realidad aunque tiene la misma pinta no es un botón
00:00:43
es un list speaker porque necesitamos buscar con el bluetooth a lo que queremos conectarnos
00:00:45
entonces como lo vamos a poner un poquito más bonito
00:00:52
lo ponemos los dos para que tenga la misma forma que las fotos que os he subido al archivo del drive
00:00:57
lo vamos a poner dentro de una estantería que está aquí
00:01:06
cogemos una estantería horizontal y la ponemos aquí
00:01:10
y dentro vamos a poner los dos botones
00:01:14
para que ocupe todo el espacio ya lo hemos hablado
00:01:19
vamos aquí a anchura
00:01:28
y en vez de poner automática
00:01:31
ponemos fill parent
00:01:33
estamos en el botón
00:01:35
le damos a ok
00:01:38
ahora al list picker
00:01:39
también lo ponemos que ocupe todo
00:01:41
ok
00:01:43
y en la estantería
00:01:45
también
00:01:47
ahora ya tenemos
00:01:50
que ocupa todo el espacio
00:01:55
también podéis cambiar los colores
00:01:57
y todo lo que queréis para hacerlo más bonito
00:02:00
Pero en el vídeo vamos a ir a lo básico.
00:02:02
Vamos a cambiar los nombres de los botones para que sepamos qué es lo que hace cada uno.
00:02:04
Aquí, en texto, ponemos conectar, porque es el del list picker.
00:02:11
Vamos a poner, y ya, pone conectar.
00:02:19
Y en el botón vamos a poner desconectar.
00:02:29
Vale, muy bien.
00:02:42
También vamos a cambiarle el nombre para la zona del programa
00:02:43
Pero como ahora mismo no me acuerdo de cómo lo he llamado
00:02:49
Vale, al list picker le he llamado
00:02:52
Le vamos a tener que nombrarle aquí
00:03:02
Le he llamado list picker
00:03:03
Para que recordéis que es un list picker, no es un botón
00:03:07
Y conectar, porque es con el list picker que vamos a conectar
00:03:11
Ok. Y al botón le he llamado botón desconectar.
00:03:15
Botón en inglés, porque deja igual, desconectar.
00:03:27
Estos son con los nombres con los que los vais a ver cuando nos vayamos a la zona de bloques.
00:03:33
Aquí en bloques tenemos el list ticker conectar y el botón desconectar.
00:03:40
Vale, volvemos al diseñador.
00:03:48
Tenemos un botón para conectar y uno para desconectar.
00:03:50
Como lo que vamos a hacer con la placa con BitBlock es encender y apagar un LED,
00:03:54
vamos a poner también un botón que sea el que cuando le doy se encienda el LED
00:04:02
y otro que cuando le doy se apague el LED.
00:04:07
Entonces vamos a poner estos en una vertical, creo que le he puesto, un momento, en una estantería vertical para cambiar un poco
00:04:10
Y ponemos aquí dos botones, vamos a 206, un botón y otro botón, vale
00:04:23
Los cambiamos el nombre también, al botón 1 le llamamos conectar, le vamos a llamar encender porque conectar ya hemos llamado a luz
00:04:38
Vale, el botón 2, venimos aquí, borramos esto, y le nombramos como apagar.
00:04:54
Aquí lo vamos a llamar igual también.
00:05:18
Pero recordad que el nombre que tiene aquí no tiene por qué ser el mismo que el que se ve en la pantalla del móvil.
00:05:20
El que tiene aquí tiene que ser un nombre que os resulte cómodo a la hora de programar.
00:05:34
Vale, pues ya tenemos lo que necesitamos
00:05:38
Un botón para conectar, un botón para desconectar
00:05:47
Un botón para encender, un botón para apagar
00:05:50
Os recomiendo que practiquéis un ratito y le cambiéis de color
00:05:53
Por ejemplo, al apagar le llamemos, le pongamos gris
00:05:56
Y al encender, pues como los LEDs suelen ser de color verde
00:06:01
Les podemos poner verde o el color que más os guste
00:06:06
Le podéis poner circular, le podéis poner que ocupe más espacio
00:06:08
bueno, podéis jugar con ellos y hacerlo como más os guste
00:06:12
pero lo que es importante es que estén los cuatro botones
00:06:15
uno para conectar y otro para desconectar
00:06:18
y uno para encender el LED y otro para apagar el LED
00:06:21
por ahora en este vídeo nada más
00:06:24
voy a seguir con el otro en el que vamos a ver
00:06:28
qué hacemos con la parte de la programación en el backend
00:06:31
hasta luego
00:06:35
- Subido por:
- Esther C.
- Licencia:
- Dominio público
- Visualizaciones:
- 108
- Fecha:
- 17 de abril de 2017 - 20:41
- Visibilidad:
- Público
- Centro:
- CPR INF-PRI-SEC SANTO ANGEL LA DEHESA
- Duración:
- 06′ 39″
- Relación de aspecto:
- 2.16:1
- Resolución:
- 1332x616 píxeles
- Tamaño:
- 14.55 MBytes
