Material Complementario ¡Quiero crear mi primera aplicación!
Índice RETO 1- ¡QUIERO CREAR MI PRIMERA APLICACIÓN!................................................................................................... 2 1.
INTRODUCCIÓN .................................................................................................................................................. 2
2.
PRIMEROS PASOS CON APPINVENTOR ............................................................................................................... 3
3.
EL EDITOR DE BLOQUES ...................................................................................................................................... 9
4.
OPCIONES DE VISUALIZACIÓN ...........................................................................................................................21
5.
MANEJO DE BOTONES .......................................................................................................................................24
6.
CREACIÓN DE APLICACIÓN DE TURISMO. TURI SMO. ..........................................................................................................25
Reto 1- ¡Quiero crear mi primera aplicación!
1. Introducción AppInventor es una plataforma de desarrollo de aplicaciones Android pensada para gente con poco o ningún conocimiento sobre programación. Para el desarrollo de estas aplicaciones no hace falta escribir código sólo arrastrar y conectar piezas de puzzle de manera que crees tus diseños y definas qué harán. Sin embargo, ofrece suficiente potencia como para desarrollar aplicaciones simples y complejas. La combinación entre potencia y simplicidad convierten a la plataforma en un sistema revolucionario de aprendizaje. Con AppInventor vas a conseguir crear fácilmente cualquier tipo de aplicación que imagines, desde los juegos más adictivos, aplicaciones para empresas empresas hasta aplicaciones de dibujo dibujo o aplicaciones que utilicen Mapas y GPS. En este reto vas a aprender lo básico de AppInventor y vas a crear tus primeras aplicaciones que podrás ejecutar en tu propio teléfono móvil Android o, si no tienes, en un emulador de teléfono móvil en tu ordenador. Acepta el reto y aprende a crear tus propias aplicaciones Android como base o complemento de tu negocio.
2
2. Primeros pasos con AppInventor Bienvenido al reto donde vas a crear tu primera aplicación móvil. Este video muestra como empezar a trabajar con AppInventor. Recuerda que debes tener instalado y configurado AppInventor para continuar. También debes estar identificado con tu cuenta de Google. Para comenzar, dirígete a la página de AppInventor http://appinventor.mit.edu/ y selecciona “Invent”. Verás que aparece a parece una pantalla donde se muestran tus proyectos. Probablemente la pantalla te aparezca en blanco, lo que significa que no tienes ningún proyecto iniciado.
A continuación pulsa “New”, e introduce un nombre para el proyecto, por ejemplo, “HolaMundo”, y seguidamente “OK”. Al escribir el nombre ten cuidado de no espacios, solo número y letras, AppInventor no permite nombres de proyectos que contengan espacios.
3
En AppInventor puedes encontrar tres partes bien diferenciadas. En primer lugar, la página Web mediante la que se desarrolla la parte gráfica. En segundo lugar, el Editor de Bloques, una aplicación que descargas directamente de la Web de diseño. Y en tercer lugar, encontrar el emulador, es decir, un programa que simula un teléfono Android. Y por supuesto, si dispones de un teléfono móvil Android podrás probar las aplicaciones que desarrolles en tu propio teléfono.
4
La página que ves es la que utilizarás para diseñar las aplicaciones en AppInventor. Esta página se divide en cinco secciones. La primera se encuentra en la parte superior y es el Menú principal, desde donde puedes guardar los últimos cambios (sino se han guardado automáticamente), crear o eliminar pantallas y abrir el Editor de Bloques. Las otras cuatro secciones de AppInventor de izquierda a derecha son:
5
- “Palette”: Muestra la paleta o librería de componentes que vas a poder utilizar para construir las aplicaciones. Dentro de esta sección puedes encontrar diez categorías con distintas acciones:
• • • •
• •
• • •
“Basic”: Muestra componentes que permiten realizar acciones básicas, tales como: añadir botones, imágenes, etiquetas, textos, etc... “Media”: Puedes encontrar componentes para: grabar video, realizar fotografías, reproducir audio, etc.. “Animation”: Incluye elementos de animación para que añadas a tu aplicación. Social, donde puedes encontrar componentes que sirven para la comunicación con otras personas, como por ejemplo realizar llamadas, enviar correos electrónicos, mensajes SMS o comunicarnos vía Twitter. Sensors, donde puedes encontrar componentes que sirven para entre otros utilizar el GPS del teléfono o el acelerómetro. Screen Arrangement, es decir, organización de pantalla. Estos componentes sirven para organizar en pantalla otros componentes como imágenes o botones. Existen tres tipos diferentes de Arrangement: HorizontalArrangement, VerticalArrangement y TableArrangement. Estos objetos sirven para alinear nuestros componentes en la pantalla, es decir, nos ayudan a colocarlos donde queremos. LEGO® MINDSTORMS®, que incluye componentes más complejos para el desarrollo de robots. Estos componentes quedan fuera del temario de nuestro curso. Other stuff, que incluye componentes para: leer códigos de barras, bluetooth o de reconocimiento de voz, entre otros. Not ready for prime time, que contiene componentes que están en fase de desarrollo y que tampoco estudiaremos en este curso.
Un poco más a la derecha, en la parte central encontramos el “Viewer”, que e s la representación de la pantalla del teléfono, lo que veas aquí, es lo que verás en la pantalla del teléfono. La forma de construir el diseño consiste en ir arrastrando componentes desde “Palette” a “Viewer”.
6
A la derecha del Viewer puedes ver la sección “Components”. En esta sección puedes ver todos los componentes que tienes en la pantalla, aquí es donde puedes cambiar el nombre a los componentes o eliminar los que tengas en “Viewer”. Ahora mismo sólo ves dos componentes: Screen, que es la pantalla que se muestra, y el botón que acabas de insertar.
7
Y finalmente, más a la derecha encontramos la sección “ Properties”. En esta sección puedes configurar las propiedades de los componentes de la pantalla. Por ejemplo, cambiar los parámetros como el color de los textos, el tamaño y la forma de los botones o el fondo de pantalla, entre otras muchas opciones. Como puedes comprobar, es posible cambiar el texto del botón simplemente modificando el texto que aparece en el campo Text .
8
3. El Editor de Bloques El Editor de Bloques es una herramienta que proporciona AppInventor que permite decir a los componentes cómo se deben comportar. Por ejemplo “¿Qué ocurre cuando se pulsa el botón?”. Para abrir el Editor de Bloques debes pulsar el botón Open the Blocks Editor que puedes encontrar en la Web de AppInventor.
9
Al pulsar este botón se descarga un fichero (si no se ejecuta de forma automática debes ejecutarlo tú mismo). Al hacerlo se abre el Editor de Bloques y aparece una aplicación muy sencilla con un lienzo vacío donde ir definiendo cómo se comportará nuestra app.
10
El Editor de Bloques lo componen tres secciones diferentes. La primera se encuentra en la parte superior y permite: salvar los cambios (cuando no se salven automáticamente), deshacer cambios o rehacerlos. También puedes ejecutar el emulador desde esta misma pantalla.
11
La segunda sección se encuentra en la parte izquierda, formada por un menú de bloques con las herramientas necesarias para definir cómo se comporta la aplicación.
12
Esta sección contiene todos los módulos, es decir, las piezas de puzzle, que podemos utilizar para definir cómo se comportan nuestras aplicaciones. Verás que hay 3 subsecciones: “Built-in”, “My Blocks” y “Advanced”. My Blocks contiene las piezas de puzzle correspondientes a los módulos que hemos añadido anteriormente en la sección de diseño. Es decir, si en la sección de diseño añades un botón y una imagen, en My Blocks verás las piezas de puzzle correspondientes al botón y la imagen. La sección “Built-in” contiene los elementos básicos que te van a ayudar a definir cómo se comportará nuestra aplicación. Contiene: colores, números y piezas de puzzle para hacer operaciones matemáticas e, incluso, piezas de puzzle para crear o trabajar con texto, etc. Más adelante descubrirás más detalles. Finalmente tienes la sección “Advanced” con componentes más avanzados que no utilizaremos de momento. La tercera sección ocupa el resto de la pantalla, es el lienzo donde arrastrar los elementos desde el menú de bloques. Su funcionamiento es el mismo que en la Web de AppInventor. Para explicar el funcionamiento del Editor de Bloques vas a empezar realizando una aplicación sencilla. Para ello creamos un nuevo proyecto e introducimos un botón y una etiqueta (“label”). Dirígete a la Web de Diseño de AppInventor y arrastra una etiqueta o label de Palette a Viewer . Encontrarás las etiquetas dentro del subgrupo Basic.
13
Para cambiar el texto de la etiqueta, debes seleccionarla en Viewer . Al hacerlo, en Properties aparecen las propiedades de este elemento. De entre las propiedades escoge la opción Text y cambia el nombre por otro que elijas, por ejemplo “Hola / Olá”. Ahora arrastra un botón ( button) desde Palette hacia Viewer . El texto que aparece en el botón viene por defecto, pero puedes modificarlo si lo seleccionas y cambias el texto que aparece en Properties. Lo puedes cambiar por otro nombre más adecuado como, por ejemplo, “Continuar”.
14
15
Hecho esto, puedes continuar con el estudio del funcionamiento del Editor de Bloques. Abre el Bloques y pulsa en la pestaña de la parte superior derecha My Blocks, donde encontrarás elementos que has arrastrado previamente en la Web de AppInventor. Si te fijas en la Components, verás que aparecen los mismos elementos que en la columna My Blocks del Bloques.
Editor de todos los columna Editor de
Al pulsar sobre ellos, como por ejemplo, sobre Button1, se despliega una ventana donde puedes ver todos los bloques de que dispones relacionados con ese botón. En función del bloque que elijas, el botón hará una cosa u otra.
16
17
Como ves, los bloques tienen una forma parecida a la de un puzzle. De hecho, encajando bloques entre sí, es como se le da lógica a la aplicación. Por ejemplo, si quieres que la aplicación muestre el mensaje “ Bienvenido al mundo de AppInventor” en la etiqueta Label1 cada vez que se pulse el botón, debes: pulsar en Button1 y ver que componentes tienes disponibles. En el primer bloque pone “when Button1.Click do” que en inglés quiere decir “cuando se haga clic en Button1 hacer”. Esto quiere decir que cuando se pulse Button1 los componentes que pongamos dentro de esta pieza de puzzle se ejecutarán. Como quieres cambiar el contenido de la etiqueta cuando pulses el botón arrastra ese bloque al lienzo.
Todo lo que contenga ese bloque, se ejecutará cuando hagas clic en el botón, selecciona ahora el componente Label1 y ve los bloques que ofrece ahora el Editor de Bloques. Como lo que quieres es modificar el contenido de ese label, localiza un bloque que contiene el texto “set Label1.Text to”, que en inglés significa “establecer el texto del Label1 a...”.
18
Una vez localizado el bloque, arrastra al lienzo de tal forma que encaje con el bloque que ya tenías previamente.
19
Como ves, ambos bloques encajan a la perfección. Pero aún queda algo para terminar de cambiar el contenido del label: el texto a añadir. Para ello, pulsa la pestaña “Built -In” donde están todos los bloques básicos de que dispones. Pulsa en “Text”, y ve que el primer bloque, lo único que contiene es un texto, y que encaja con el hueco que falta por rellenar.
Arrastra ese bloque de tal forma que encaje con el hueco vacío.
Con esto, la aplicación ya estará funcionando, cuando pulses el botón cambiará el texto del Label1 por el texto “text”. Por último, puedes cambiar ese texto para que aparezca, por ejemplo, “ Bienvenido al mundo de AppInventor”, para ello pulsa en la palabra “text” en negrita y cambia el texto.
20
Si has realizado los pasos correctamente, al pulsar el botón se cambiará el texto de la etiqueta. Enhorabuena, ya tienes tu primera aplicación terminada, en el siguiente vídeo te explicamos cómo poder ejecutarla.
4. Opciones de visualización Una vez realizada tu primera aplicación, estarás deseando ver cómo funciona en tu teléfono o en el emulador. Para probar las aplicaciones, AppInventor da varias opciones, una de ellas consiste en probar las aplicaciones en un emulador y las otras opciones son para probar las aplicaciones en un dispositivo real. Como viste en la introducción a AppInventor, un emulador es una simulación de un teléfono real en nuestro ordenador. Cuando instalamos la aplicación de AppInventor que explicamos en el apartado de configuración, entre otras cosas, instalamos un emulador de Android. Para abrirlo e instalar nuestras aplicaciones, debes seguir los siguientes pasos: Una vez en la web de AppInventor con el proyecto “HolaMundo”, abre el Editor de Bloques, y una vez aquí, observa más detenidamente la barra de menú.
En la parte de la derecha, puedes ver dos botones: “New emulator” y “Connect to Device...”. Con el botón “New emulator” abres un nuevo emulador y con el botón “Connect to Device...” conectas AppInventor con el emulador para que la aplicación en cuestión se ejecute en él. Pulsa el botón “New emulator”. Cuando el emulador termine de inicializarse aparece la pantalla de bloqueo clásica de Android, como vimos en el apartado de introducción.
21
En Windows, hay veces que junto al emulador aparece una pantalla negra con un mensaje de error o advertencia. Esto es normal, no pasa nada, es importante no cerrar esa pantalla ya que se cerrará también el emulador. Ahora que el emulador está completamente arrancado, pulsa el botón “Connect to Device...” para conectarlo con AppInventor y poder visualizar la aplicación.
Al pulsarlo, se nos despliega un menú donde podemos elegir el dispositivo con el que queremos conectar AppInventor, en nuestro caso, debemos seleccionar “emulator-5554”. Cuando lo seleccionamos, el icono gris del teléfono pasa a ser de color amarillo, lo que indica que se está intentando conectar...
… una vez que AppInventor se ha conectado al emulador, el icono pasará a ser de color verde.
22
Llegados a éste punto ya tienes la aplicación ejecutándose en el emulador. Para poder utilizarla, solo debes desbloquear el emulador como si fuera un teléfono convencional, desplazando la barra de bloqueo hacia la derecha. Si ejecutas la aplicación anterior verás como efectivamente se cambia el texto de la etiqueta al pulsar el botón.
No hace falta que reiniciemos el emulador cada vez que queramos probar algo nuevo, ya que al estar “conectado”, cualquier modificación que hagamos en AppInventor se verá reflejada de forma inmediata en el emulador. Sin embargo, si vieras que el emulador no actualiza la aplicación puedes volver a pulsar en “emulator-5554” y esperar a que el icono del teléfono pase a verde.
23
5. Manejo de botones En este video vamos a trabajar un poco más con el manejo de botones para ayudarte a comprender su funcionamiento. Ahora vamos a imaginar que quieres añadir un botón que al pulsarlo cambie el color del botón. Primero iremos a la Web de AppInventor, pulsaremos Button y lo arrastraremos hasta Screen1. Verás que en la pantalla (Screen1) aparecerá Text for Button, este es el nuevo botón que hemos añadido. Ahora debemos añadir la acción de cambiar el color del botón. Para poder realizarlo, debemos ir al Editor de Bloques. Recuerda que el Editor de Bloques es el que permite que los botones/imágenes/etc. realicen cualquier acción. En el Editor de Bloques vamos a pulsar en My Blocks. En este apartado veremos los elementos que hayamos añadido. En nuestro caso, nos deberá aparecer My Definitions (lo veremos más adelante), Button 1 (el botón que hemos añadido antes en la Web de AppInventor) y Screen1 (la pantalla que antes hemos visto en la Web de AppInventor). Como lo que queremos es cambiar el color del botón al pulsarlo, de entre las tres opciones que nos aparecen, escogeremos Button1. Una vez hemos pulsado, a la derecha nos aparecerá una columna con todas las “piezas” disponibles para nuestro botón. Las “piezas” disponibles son diferentes para botones, etiquetas, etc. Cada elemento tiene unas “piezas” específicas. Vamos a seguir con nuestro ejercicio. Tenemos que escoger una pieza que nos diga que al pulsar el botón suceda alguna acción, la pieza que nos permite hacerlo es “when Button1.Click do” (cuand o pulsemos el botón hacer). Por tanto, pulsamos sobre esta pieza y la arrastramos hasta el lienzo. Ahora ya tenemos la pieza que realiza la acción pero debemos añadir la parte en que cambia de color. Para ello volvemos a pulsar sobre Button1 y vemos las opciones de piezas que tenemos. La pieza que permite cambiar el color del botón es set Button1.BackgroundColor to, así que pulsamos dicha pieza y la arrastramos hacia el lienzo. Ahora debemos encajar las piezas que tenemos en el lienzo, cuando lo consigamos oiremos un “clic”. Solo nos queda añadir el color, para hacerlo pulsamos en Built-In y en Colors. Nos aparecerán en la parte derecha todos los colores que tenemos disponibles, solo tenemos que pulsar un color y arrastrarlo hasta la pieza para encajarlo. Para comprobar si lo hemos realizado correctamente, debemos pulsar en la parte superior derecha Connect to Device y en el desplegable escoger la opción emulator-5554. De este modo, podremos ver la aplicación que hemos creado en el emulador y comprobar su funcionamiento. Una vez cargado, debemos pulsar sobre el botón que aparece en la pantalla del emulador con el texto “Text for Button . Si al pulsar, el botón cambia de color y aparece con el color elegido, nuestra aplicación ha sido un éxito. ”
24
6. Creación de aplicación de Turismo. Lo que vamos a hacer en este video es realizar una aplicación de turismo que dará información de 3 monumentos de una ciudad. Al pulsar sobre cada uno de ellos se mostrará el nombre del monumento y una imagen.
25
Para empezar, abrimos un nuevo proyecto de AppInventor, al que llamaremos “Turismo”. Una vez creado vamos a añadir una imagen, dos etiquetas o labels y tres botones. La primera etiqueta nos servirá como título de la aplicación, para ello pulsamos sobre la etiqueta y vamos a la sección de propiedades a la derecha. Una vez en la sección propiedades le cambiamos el texto por defecto modificando el parámetro “Text” y ponemos el nombre de la ciudad que queremos promocionar con nuestra aplicación, por ejemplo “Descubre Madrid a pie”, tú puedes poner el nombre de tu ciudad. También en la zona de propiedades aumentamos el tamaño del texto un poco para dar más la sensación de título, por ejemplo ponemos tamaño 25. En la segunda etiqueta pondremos un mensaje para indicar al usuario que pulse sobre el monumento que quiera para saber, por ejemplo “Escoge uno de los siguientes monumentos”. Más adelante utilizaremos esta etiqueta para mostrar el nombre del monumento que se pulsa. A continuación cambiamos el texto de los botones. Asignamos el texto ”Palacio de Cibeles” al primer botón, “Bellas Artes” al segundo botón y “Catedral” al tercer botón. Para ello pulsamos cada uno de los boto nes y vamos a la sección de propiedades y cambiamos el parámetro “Text”. Estos botones servirán para mostrar el nombre sobre ese monumento.
26
27
Una vez hecho esto debemos definir cómo funcionará la aplicación, para ello, como hemos hecho en los apartados anteriores, abrimos el Editor de Bloques y pulsamos en la pestaña “My Blocks” para ver todos nuestros componentes. Como puedes ver en el apartado de Components de la Web de AppInventor, es difícil saber qué botón es cada uno, ya que el nombre por defecto de los componentes no nos dice nada. Por ello, vamos a cambiar el nombre de esos componentes por otro que nos de algo más de información. Pulsamos en el componente que queramos renombrar y en la sección Components pulsamos el botón Rename.
Se desplegará una pantalla donde podrás modificar el nombre del componente en cuestión. En este caso, los hemos renombrado igual que su título, es decir, al botón de Palacio lo hemos llamado “BotonPalacio”, al botón que mostrará información del Círculo de Bellas Artes lo hemos llamado “BotonBellasArtes” y “BotonCatedral” al botón que mostrará información de la Catedral. Ten cuidado al poner el nombre, no uses acentos, ya que no los admite y dará error. Por último, al Label2, donde vamos a escribir la información al pulsar los botones lo hemos llamado “LabelResultado”.
28
29
Una vez hecho, dirígete al Editor de Bloques, donde ahora sí puedes distinguir un componente de otro. Escoge los bloques apropiados para cambiar el texto de la etiqueta “LabelResultado”. Pulsa el botón “BotonPalacio” para ver qué bloques puedes utilizar, e igual que hiciste anteriormente, arrastra y suelta el bloque “when BotonPalacio.Click do...” para definir lo que debe ocurrir al pulsar el botón “BotonPalacio”.
Recuerda que al pulsar cualquier botón de los monumentos, en LabelResultado deberá aparecer el nombre del monumento en cuestión. Así, debes buscar un módulo dentro de LabelResultado que permita cambiar el texto.
30
Verás un módulo que se llama “set LabelResultado.Text to...” que significa “establecer el texto de LabelResultado a...”. Por tanto arrastra este módulo al lienzo y conéctalo con el módulo que tenías, para que se ejecute cuando se haga clic en el botón.
Ahora sólo falta añadir el texto que debe mostrarse al pulsar el bótón. En este caso vamos a escribir “Palacio de Cibeles”. Para ello debes ir a la sección “Built-in”, donde se encuentran los módulos más comunes de AppInventor y pulsar en “Text”. Verás una serie de módulos relacionados con cadenas de texto. Elige la primera “text” y arrástrala al lienzo de manera que quede conectada con los módulos anteriores. Sólo nos queda cambiar la cadena de
31
texto que viene por defecto text por el texto que queremos que aparezca. Para ello pulsa text y escribe “Palacio de Cibeles”.
Ahora debes hacer lo mismo para los botones “Bellas Artes” y “Catedral”. Para ello, selecciona la etiqueta “LabelResultado” para ver los bloques disponibles, y arrastra el bloque necesar io para editar el texto del label “set LabelResultado.Text to”. Sólo queda añadir la parte del texto y modificar el nombre text por el nombre de los monumentos.
32
33
Como podemos imaginar por lo explicado hasta ahora, esto ya debería funcionar, y el texto del label resultado debería cambiar correctamente, de todas formas, vamos a ejecutar la aplicación tal y como la tenemos para comprobar que todo va bien. Para ello, pulsamos el botón “New emulator”, como hemos explicado antes, y cuando esté totalmente arrancado, conectamos el emulador con AppInventor. Una vez que el emulador esté abierto y conectado, sólo queda desbloquearlo para probar nuestra aplicació n.
Si pulsas en cada uno de los botones, verás que LabelResultado va cambiando como debe.
Ya ves que has construido una aplicación funcional. A partir de ahí puedes irla mejorando, por ejemplo añadiendo imágenes, cambiando el color de fo ndo o del texto.
34
Ahora vamos a hacer que cada vez que se pulse el botón de un monumento se muestre la imagen de dicho monumento. Para ello debes subir 3 imágenes, una por cada monumento. Para subirlas a la Web de AppInventor debes dirigirte a la sección “Media”, en la parte inferior de bajo de Components y pulsar en el botón “Add” (“Añadir”). A continuación selecciona la imagen en tu computador y pulsa Ok para terminar de subirlo. Una vez subida la primera imagen, sube las 2 dos siguientes.
Una vez tienes las imágenes añadidas, abre al Editor de Bloques y selecciona el componente image1 que encontrarás en la sección MyBlocks. Al pulsar sobre Image1 se despliega una lista de funciones que puedes hacer con esa imagen. Entre ellas hay una que sirve para cambiar la imagen que muestra, se l lama “set Image1.Picture to...”, arrástrala al lienzo conectándola con el módulo del clic del BotonPalacio. A continuación añade texto con el nombre de la imagen, en este caso se llama “ayuntamiento2.jpg”. Una vez hecho esto haz lo mismo con los otros dos botones, pero añadiendo en cada caso la imagen correspondiente. Atención, debes poner el mismo nombre en text que tiene la imagen en tu ordenador.
35
36
Si lo pruebas en el emulador o en el móvil verás que al pulsar sobre los botones se muestra el nombre del monumento y la imagen correspondiente.
Otra mejora que puedes hacer, y que hará que la aplicación quede mucho más útil es convertirla en una audioguía, es decir, que la propia aplicación diga con voz información sobre la ciudad. De este modo al pulsar sobre el botón “BotonPalacio”, además de mostrar el texto y la imagen se dirá por voz. Lo mismo ocurrirá con los botones de Bellas Artes y Catedral.
Para ello AppInventor dispone de un componente que se llama “TextToSpeech” y se encuentra en la sección “Other stuff”de la Web de AppInventor. Lo primero que debes hacer es arrastrar este componente a Viewer.
37
38
Al arrastrar el componente al Viewer vas a ver como no aparece en la pantalla junto con los demás componentes, sino que aparece abajo, en la sección “ Non-visible components”, que en inglés significa “Componentes no visibles”. Esto es porque este componente no se ve en la parte de diseño, pero sí lo podrás ver y utilizar en el Editor de Bloques. Lo único que hay que configurar de este elemento es definir el idioma en el que se pronunciarán los textos. En este caso vamos a seleccionar español, por tanto pulsamos sobre el componente y nos vamos a la sección de Propiedades a la derecha, y donde pone Language escribimos “SPA” de Spanish. Una vez hecho esto, abre el Editor de Bloques y busca TextToSpeech lo encontrarás en la sección “My Blocks”. Pulsa sobre este nuevo componente y verás un módulo que pone “call TextToSpeech1. Speak message”, (significa que el módulo TextToSpeech1 dirá con voz el mensaje que le pasemos como texto). Arrastra este componente y ponlo debajo del último que había en “when BotonPalacio.Click do”. A continuación sólo debes conectar un módulo de text y añadir el texto que quieras que diga la aplicación. Verás que cualquier texto que pongas ahí se pronunciará. Prueba a poner “Hola” y tu nombre, verás como tu aplicación te saluda. Ahora cambia el texto a pronunciar por algo alusivo a ese monumento, para que de sensación de audioguía turística.
39
40
