Tutorial apptoide

Programación enProgramación en
Android:Android:
ApptoideApptoide
Enol Matilla BlancoEnol Matilla Blanco

ÍndiceÍndice
 AndroidAndroid
 AppInventorAppInventor
– GlosarioGlosario
– Crear nuevo proyectoCrear nuevo proyecto
– Barras de herramientasBarras de herramientas
– MapeadoMapeado (editor de bloques)(editor de bloques)
– Ejemplos grupos simplesEjemplos grupos simples
– ArrangementsArrangements
– Ejemplos grupos complejosEjemplos grupos complejos
– Emular a un dispositivoEmular a un dispositivo
– EmpaquetarEmpaquetar
– DistribuciónDistribución
 La app usada paraLa app usada para
los ejemplo podrálos ejemplo podrá
ser descargada alser descargada al
final de lafinal de la
presentación, opresentación, o
desde este enlace.desde este enlace.

AndroidAndroid
 Es un sistema operativo libre y gratuito.Es un sistema operativo libre y gratuito.
 Se programa sobre un java modificado.Se programa sobre un java modificado.

AndroidAndroid
 Algunos programas para programar son:Algunos programas para programar son:
 Java Eclipse, con el SDK de android.Java Eclipse, con el SDK de android.

AndroidAndroid
 Programas de interfaz gráfica, comoProgramas de interfaz gráfica, como
apptoide, Basic 4Android, etc.apptoide, Basic 4Android, etc.

AppinventorAppinventor
 Dentro de este ultimo modo deDentro de este ultimo modo de
programar, encontramos appinventor,programar, encontramos appinventor,
con el mismo método de hacer lacon el mismo método de hacer la
estructura externa, pero unaestructura externa, pero una
revolucionaria forma de mapear elrevolucionaria forma de mapear el
interior, con “piezas de puzzle”.interior, con “piezas de puzzle”.

GlosarioGlosario
 Antes que nada, un pequeño glosarioAntes que nada, un pequeño glosario
de terminos:de terminos:
 Canvas:Canvas: es un elemento HTML incorporadoes un elemento HTML incorporado
en HTML5 que permite la generación de gráficosen HTML5 que permite la generación de gráficos
dinámicamente por medio del dinámicamente por medio del scriptingscripting. Permite. Permite
generar gráficos estáticos y animaciones.generar gráficos estáticos y animaciones.

GlosarioGlosario
 Scrip:Scrip: guión, archivo de órdenes o archivo de
procesamiento por lotes
 Sprite:Sprite: Se trata de un tipo de mapa de bits dibujadosSe trata de un tipo de mapa de bits dibujados
en la pantalla del ordenador por hardware gráficoen la pantalla del ordenador por hardware gráfico
especializado sin cálculos adicionales de la CPU.especializado sin cálculos adicionales de la CPU.

 Lo primero, entramos enLo primero, entramos en appinventorappinventor..
 Y le damosY le damos
a inventar.a inventar.

 Nos pedirá un correo o cuenta, en mi caso,Nos pedirá un correo o cuenta, en mi caso,
una cuenta de Gmail. Le damos a permitir.una cuenta de Gmail. Le damos a permitir.

 Tras hacerlo y confirmar el correo que nosTras hacerlo y confirmar el correo que nos
manda, podremos entrar a la portada.manda, podremos entrar a la portada.
 Para crear una app damos a new, paraPara crear una app damos a new, para
crear un proyecto nuevo. Yo tengo 3.crear un proyecto nuevo. Yo tengo 3.

Crear nuevo proyectoCrear nuevo proyecto
 Al pulsar en new, simplementeAl pulsar en new, simplemente
escogemos el nombre del proyecto,escogemos el nombre del proyecto,
que posteriormente será el de la app,que posteriormente será el de la app,
cuando la empaquetemos.cuando la empaquetemos.

Página generalPágina general
 Nos saldrá algo así, pero esto en blanco.Nos saldrá algo así, pero esto en blanco.
1.Para salir.1.Para salir.
2.Volver a proyectos.2.Volver a proyectos.
3.Ver ejemplos.3.Ver ejemplos.

 Primero veremos toda la barra dePrimero veremos toda la barra de
herramientas, o “paleta”, yherramientas, o “paleta”, y
posteriormente el resto de barras y elposteriormente el resto de barras y el
editor de bloques.editor de bloques.
 Para colocar un elemento de la “paleta”Para colocar un elemento de la “paleta”
en la aplicación, arrastrarlo sobre laen la aplicación, arrastrarlo sobre la
“pantalla emuladora”.“pantalla emuladora”.

PaletaPaleta
 Coloca un botón interactivoColoca un botón interactivo
 Coloca un espacio editableColoca un espacio editable
 Coloca una casilla marcableColoca una casilla marcable
 Coloca un reloj, cronometro, no visibleColoca un reloj, cronometro, no visible
 Coloca un hueco, donde subir una imagenColoca un hueco, donde subir una imagen
 Coloca un rectángulo de dialogoColoca un rectángulo de dialogo
 Coloca una listaColoca una lista
 Coloca una casilla de contraseñaColoca una casilla de contraseña
 Coloca un rectángulo de dialogo editableColoca un rectángulo de dialogo editable
 Objeto no visible que guarda datos y los envía a través deObjeto no visible que guarda datos y los envía a través de
internet a tu cuenta.internet a tu cuenta.

PaletaPaleta
 Elemento no visible, unible a botón paraElemento no visible, unible a botón para
grabar video.grabar video.
 Elemento no visible, unible a botón paraElemento no visible, unible a botón para
sacar fotos.sacar fotos.
 Botón selector de imágenes guardadas enBotón selector de imágenes guardadas en
el dispositivo. Unible a mas botones parael dispositivo. Unible a mas botones para
seleccionar como fondo de escritorio, etc.seleccionar como fondo de escritorio, etc.
 Elemento no visible, al que se le adjudicaElemento no visible, al que se le adjudica
una canción, imagen, y se vincula a ununa canción, imagen, y se vincula a un
botón, imagen…botón, imagen…
 Elemento no visible, adjudicado a unaElemento no visible, adjudicado a una
canción, reproducible con un botón.canción, reproducible con un botón.
 Elemento visible, adjudicado a un video,Elemento visible, adjudicado a un video,
reproducible desde el mismo elemento.reproducible desde el mismo elemento.

PaletaPaleta
 Sprite circular que seSprite circular que se
puede integrar en unpuede integrar en un
canvas.canvas.
 Sprite que se puedeSprite que se puede
integrar en un canvas,integrar en un canvas,
con la forma de lacon la forma de la
imagen subidaimagen subida
correspondiente.correspondiente.

PaletaPaleta
 Botón que abre una lista de contactos,Botón que abre una lista de contactos,
editables.editables.
 Cuadro de texto para E-mailsCuadro de texto para E-mails
 Elemento no visible vinculable a un botón,Elemento no visible vinculable a un botón,
que llama a quien este especificado en elque llama a quien este especificado en el
valor del elementovalor del elemento
 Botón que abre una lista de contactosBotón que abre una lista de contactos
telefónicos.telefónicos.
 Cuadro de texto para enviar un mensaje,Cuadro de texto para enviar un mensaje,
poner los datos de un contacto, etc.poner los datos de un contacto, etc.
 Elemento no visible vinculado a una cuentaElemento no visible vinculado a una cuenta
de Twitter. Cuando el usuario acepta, sede Twitter. Cuando el usuario acepta, se
puede hacer lo mismo que desde supuede hacer lo mismo que desde su
aplicación.aplicación.

PaletaPaleta
 Integra a la app unIntegra a la app un
acelerómetro.acelerómetro.
 Integra a la app un sensorIntegra a la app un sensor
geolocalizador.geolocalizador.
 Integra a la app un sensor deIntegra a la app un sensor de
orientación, para girar pantalla,orientación, para girar pantalla,
etc.etc.
 Todos los sensores sonTodos los sensores son
elementos no visibles.elementos no visibles.

PaletaPaleta
 Los arrangement sonLos arrangement son
cuadrados o rectánguloscuadrados o rectángulos
donde organizar botones ydonde organizar botones y
demás, puedes colocarlos:demás, puedes colocarlos:
 Horizontales.Horizontales.
 Formando una tabla con elFormando una tabla con el
numero de columnas y filasnumero de columnas y filas
que se desee.que se desee.
 Verticales.Verticales.

PaletaPaleta
 Son todo elementos noSon todo elementos no
visibles configurables paravisibles configurables para
que un robot LEGO puedaque un robot LEGO pueda
ser controlado desde laser controlado desde la
aplicación, desdeaplicación, desde
sensores, a comandossensores, a comandos
basicos y mas complejos.basicos y mas complejos.

PaletaPaleta
 Objeto no visible configurable para ejecutar otraObjeto no visible configurable para ejecutar otra
app mediante comandos, vinculando a un botón.app mediante comandos, vinculando a un botón.
 Escáner de códigos QR o de barras mediante laEscáner de códigos QR o de barras mediante la
cámara del dispositivo.cámara del dispositivo.
 Cliente y servidor de bluetooth, respectivamente.Cliente y servidor de bluetooth, respectivamente.
 Objeto no visible, que aparece cuando se cumple XObjeto no visible, que aparece cuando se cumple X
condición, en forma de texto (notificación).condición, en forma de texto (notificación).
 Conversor de voz a texto.Conversor de voz a texto.
 Conversor de texto a voz.Conversor de texto a voz.
 Conexión con base de datos en la web.Conexión con base de datos en la web.
 Proporciona funciones HTTP.Proporciona funciones HTTP.

PaletaPaleta
 Objeto no visible que se comunicaObjeto no visible que se comunica
con Google fusion tables.con Google fusion tables.
 Permite a la app comunicarse conPermite a la app comunicarse con
el cliente de un juego online.el cliente de un juego online.
 Grabadora de audio mediante elGrabadora de audio mediante el
micrófono del dispositivo.micrófono del dispositivo.
 Permite votar y comunicar elPermite votar y comunicar el
resultado a una web.resultado a una web.
 Permite ver una pagina webPermite ver una pagina web
completamente.completamente.

Barra SuperiorBarra Superior
 Esta es la barra superior. Desde ella seEsta es la barra superior. Desde ella se
puede, en orden:puede, en orden:
 Salvar (guardar) el proyecto.Salvar (guardar) el proyecto.
 Salvar el proyecto con nuevo nombre, oSalvar el proyecto con nuevo nombre, o
sobrescribiendo otro.sobrescribiendo otro.
 Crear un punto de salvado, para volver atrás.Crear un punto de salvado, para volver atrás.
 Añadir (1º) o remover (2º) una pantalla.Añadir (1º) o remover (2º) una pantalla.
 Abrir el editor de bloques (mas adelante seAbrir el editor de bloques (mas adelante se
verá para que)verá para que)
 Empaquetar la aplicación en un archivo .apkEmpaquetar la aplicación en un archivo .apk

ViewView
 Esto es lo que seEsto es lo que se
vería en el movilvería en el movil
,tablet, etc.,tablet, etc.
 Arriba vemos lasArriba vemos las
pantallas creadas, ypantallas creadas, y
editables.editables.

Elementos no visiblesElementos no visibles
 Esto está colocado debajo del visor (loEsto está colocado debajo del visor (lo
anterior) y nos muestra los elementosanterior) y nos muestra los elementos
no visibles de la pantalla que se estano visibles de la pantalla que se esta
editando, en mi caso, 6 reproductoreseditando, en mi caso, 6 reproductores
(uno por canción).(uno por canción).

ElementosElementos
 Esto esta a la derecha deEsto esta a la derecha de
visor, y nos muestravisor, y nos muestra
todos los botones,todos los botones,
imágenes, y elementosimágenes, y elementos
de la pantalla actual.de la pantalla actual.
 Se pueden borrar ySe pueden borrar y
renombrar lo elementos.renombrar lo elementos.
 Al pulsar sobre uno, nosAl pulsar sobre uno, nos
permitirá editar aspectospermitirá editar aspectos
básicos, a la derecha.básicos, a la derecha.

Media y propiedadesMedia y propiedades
 Colocación.Colocación.
 Fondo.Fondo.
 Imagen de fondo.Imagen de fondo.
 Animación de cierreAnimación de cierre
 Icono de la app (estamos en laIcono de la app (estamos en la
edición de la pantalla principal)edición de la pantalla principal)
 Animación de arranqueAnimación de arranque
 Como orientar la pantallaComo orientar la pantalla
 Si es scrollableSi es scrollable
 Nombre de la paginaNombre de la pagina
 Versión del códigoVersión del código
 Versión de la appVersión de la app
 Aquí se suben todas las imágenes y canciones que usara laAquí se suben todas las imágenes y canciones que usara la
app.app.
 Aquí se editan los aspectos básicos de cada elemento:Aquí se editan los aspectos básicos de cada elemento:

Editor de bloquesEditor de bloques
 Una vez acabado el diseño general deUna vez acabado el diseño general de
la app, los botones, imagen de fondo,la app, los botones, imagen de fondo,
etc, hay que “mapear” la app,etc, hay que “mapear” la app,
organizarla internamente.organizarla internamente.
 Pulsamos en “open block editor”, yPulsamos en “open block editor”, y
nos descargara este archivo:nos descargara este archivo:

 Lo ejecutamos y empezara a descargar.Lo ejecutamos y empezara a descargar.

 Cuando acabe, ejecutamos.Cuando acabe, ejecutamos.
 Si no queremos q nos molesten cada vez que ejecutamos,Si no queremos q nos molesten cada vez que ejecutamos,
marcar.marcar.

 Si salen mensajes aceptar todos, y siSi salen mensajes aceptar todos, y si
se traba, cerrar y ejecutar de nuevo,se traba, cerrar y ejecutar de nuevo,
entrará directamente.entrará directamente.

 Al terminar, aparecerá esta ventana.Al terminar, aparecerá esta ventana.

 Esta es la barra superior, y de izquiera a derecha:Esta es la barra superior, y de izquiera a derecha:
 Nombre de la app (proyecto)Nombre de la app (proyecto)
 Guardar los cambios realizadosGuardar los cambios realizados
 Volver atrás (por si te has equivocado, o borraste lo qVolver atrás (por si te has equivocado, o borraste lo q
no era)no era)
 Volver adelanteVolver adelante
 Nueva emulación (explicación más adelante)Nueva emulación (explicación más adelante)
 Conectar con dispositivoConectar con dispositivo
 Estado del dispositivo conectadoEstado del dispositivo conectado
 Zoom del minimapaZoom del minimapa

 En esta nueva ventana que se nosEn esta nueva ventana que se nos
abrió, editaremos todo el interior de laabrió, editaremos todo el interior de la
app, lo que hacen los botones,app, lo que hacen los botones,
animaciones, etc, mediante “piezas deanimaciones, etc, mediante “piezas de
puzzle”.puzzle”.

 A la izquierda delA la izquierda del
todo, tenemos trestodo, tenemos tres
pestañitas.pestañitas.
 Se empieza por laSe empieza por la
2º, en la que están2º, en la que están
las “piezas” delas “piezas” de
cada elemento decada elemento de
la pantalla en lala pantalla en la
que estemos en laque estemos en la
pagina web.pagina web.

 Las mas básicas son:Las mas básicas son:
 Cuando pulsas (X botón,Cuando pulsas (X botón,
imagen) hacer (otra pieza)imagen) hacer (otra pieza)
 Cuando pulsasCuando pulsas
prolongadamente (X botón)prolongadamente (X botón)
hacer (otra pieza)hacer (otra pieza)
 Transformar el fondo (delTransformar el fondo (del
botón, imagen, etc) en (piezabotón, imagen, etc) en (pieza
de color, o de una imagen)de color, o de una imagen)
 Marcar la anchura de (X) enMarcar la anchura de (X) en
(pieza numérica)(pieza numérica)

 Las piezas deLas piezas de
color están en lacolor están en la
pestaña “built-in”,pestaña “built-in”,
dentro de “colors”dentro de “colors”

 También hayTambién hay
piezas de control:piezas de control:
 Si (x) entoncesSi (x) entonces
(Y)(Y)
 Si (x) haz (Y) ySi (x) haz (Y) y
sino (Z)sino (Z)
 El resto son conEl resto son con
variablesvariables
editables coneditables con
casillas de texto ycasillas de texto y
rangos.rangos.

Grupos SimplesGrupos Simples
 Ahora que conocemos las piezasAhora que conocemos las piezas
básicas, comenzaremos a crearbásicas, comenzaremos a crear
“grupos cerrados”.“grupos cerrados”.
– 1º, Botón para cerrar una pantalla, o salir1º, Botón para cerrar una pantalla, o salir
de la aplicación.de la aplicación.
– 2º, Botón para abrir una pantalla.2º, Botón para abrir una pantalla.
– 3º, Establecer fondo de pantalla al iniciar3º, Establecer fondo de pantalla al iniciar
pantalla.pantalla.
– 4º, Botón para reproducir una canción.4º, Botón para reproducir una canción.

Grupo cerrado 1ºGrupo cerrado 1º
 Necesitamos colocar en la app desdeNecesitamos colocar en la app desde
la web:la web:
– 1º, Botón que usaremos para cerrar la1º, Botón que usaremos para cerrar la
appapp
– Es muy simple, el grupo quedaría así:Es muy simple, el grupo quedaría así:
Se usan la pieza del botón “whenSe usan la pieza del botón “when
(nombre que hayamos dado al(nombre que hayamos dado al
botón).click) do” y la pieza “closebotón).click) do” y la pieza “close
(nombre de la pantalla)”(nombre de la pantalla)”

 Necesitamos lo mismo que en elNecesitamos lo mismo que en el
anterior, y las mismas “piezas”,anterior, y las mismas “piezas”,
cambiando la de “close screen” porcambiando la de “close screen” por
“open screen” (en“open screen” (en built in>controlbuilt in>control) y) y
añadiendole al lado una de texto (enañadiendole al lado una de texto (en
built in>textbuilt in>text) con el nombre de la) con el nombre de la
pantalla a abrir, en este caso, Screen1pantalla a abrir, en este caso, Screen1

 En este caso no necesitamos ningúnEn este caso no necesitamos ningún
elemento, ya que se usaran piezas de laelemento, ya que se usaran piezas de la
pantalla, ni botones ni nada.pantalla, ni botones ni nada.
 Se empieza con la pieza “When (nombre de la pantalla).initialize do”Se empieza con la pieza “When (nombre de la pantalla).initialize do”
dentro dedentro de my blocksmy blocks y pulsando sobre el nombre de la pantalla.y pulsando sobre el nombre de la pantalla.
 Luego, del mismo sitio, se pone la pieza “set (x).Backgroundcolor to”,Luego, del mismo sitio, se pone la pieza “set (x).Backgroundcolor to”,
y dentro dey dentro de built in>colorsbuilt in>colors
La pieza del color que queramos, o dentro de una imagen subidaLa pieza del color que queramos, o dentro de una imagen subida
(pulsando en su nombre) poniendo la pieza que diga “component(pulsando en su nombre) poniendo la pieza que diga “component
(nombre de la imagen)”(nombre de la imagen)”

 Para este ya necesitaremos mas cosas:Para este ya necesitaremos mas cosas:
– 1º, Botón, que ejecutara la canción.1º, Botón, que ejecutara la canción.
– 2º, Elemento no visible “player”2º, Elemento no visible “player”
– 3º, Subimos la canción en mp3, pulsando3º, Subimos la canción en mp3, pulsando
“upload new” dentro de“upload new” dentro de mediamedia, en la web., en la web.
– 4º, Vinculamos el player con la canción,4º, Vinculamos el player con la canción,
pulsando sobre él enpulsando sobre él en elementoselementos y dondey donde
pone “source” poniendo la canciónpone “source” poniendo la canción
previamente subida.previamente subida.

 Una vez hecho lo anterior, desde el editor de bloques:Una vez hecho lo anterior, desde el editor de bloques:
– 1º Ponemos la pieza básica del “botón”1º Ponemos la pieza básica del “botón”
– 2º Ponemos la pieza, que esta dentro de2º Ponemos la pieza, que esta dentro de my blocks>player1my blocks>player1
(o el que sea), “call player1.Start”(o el que sea), “call player1.Start”
Nos quedaría algo así:Nos quedaría algo así:
Para pararlo, habría que poner otro botón y poner la pieza básicaPara pararlo, habría que poner otro botón y poner la pieza básica
del botón y la pieza “call player1.Pause” o “call player1.Stop”,del botón y la pieza “call player1.Pause” o “call player1.Stop”,
depende de si queremos pausarla o pararla del todo.depende de si queremos pausarla o pararla del todo.
Otra opción, mas complicada, la veremos más adelante.Otra opción, mas complicada, la veremos más adelante.

ArrangementsArrangements
 Antes de empezar con bloquesAntes de empezar con bloques
complejos, tendremos un problema,complejos, tendremos un problema,
ya que si pones un botón tras otro,ya que si pones un botón tras otro,
automáticamente te pone uno debajoautomáticamente te pone uno debajo
de otro, sin posibilidad de moverlos.de otro, sin posibilidad de moverlos.
 Para esto vamos a usar losPara esto vamos a usar los
“Arrangements”.“Arrangements”.

ArrangementsArrangements
 Existen tres, que ya vimos anteriormente, yExisten tres, que ya vimos anteriormente, y
funcionan de manera muy simple:funcionan de manera muy simple:
 Arrastras el “arrangement” que se quiera sobre laArrastras el “arrangement” que se quiera sobre la
pantalla emuladora, y saldrá un rectángulo (negro).pantalla emuladora, y saldrá un rectángulo (negro).
Todo lo que pongas en ese rectángulo se ordenaraTodo lo que pongas en ese rectángulo se ordenara
según el “arrangement” usado, los cuales sonsegún el “arrangement” usado, los cuales son
configurables.configurables.
 El de arriba es uno de tablaEl de arriba es uno de tabla
 El de abajo uno horizontalEl de abajo uno horizontal

Grupos complejosGrupos complejos
 Ahora que sabemos hacer gruposAhora que sabemos hacer grupos
simples, comenzaremos con grupossimples, comenzaremos con grupos
que se unen entre si, ya algo masque se unen entre si, ya algo mas
complejos.complejos.

Grupos complejosGrupos complejos
 1º, Texto variable en función de (x)1º, Texto variable en función de (x)
 2º,2º, Pasar a la siguiente canción al terminar.Pasar a la siguiente canción al terminar.
 3º,3º, Botón Pausa.Botón Pausa.
 4º, Botón Stop.4º, Botón Stop.

Grupo complejo 1ºGrupo complejo 1º
 Necesitaremos el elemento “text box”, yNecesitaremos el elemento “text box”, y
los elementos de que dependen.los elementos de que dependen.
 Siempre dependerá de algo, por lo que en elSiempre dependerá de algo, por lo que en el
mapeado se pondrá el botón ación de quemapeado se pondrá el botón ación de que
depende, y la pieza del text Box “set textbox(X)depende, y la pieza del text Box “set textbox(X)
to” y la pieza “text” dentro deto” y la pieza “text” dentro de Built in>TextBuilt in>Text

 Necesitamos los botones de cada canción, y unNecesitamos los botones de cada canción, y un
reproductor por cada una.reproductor por cada una.
 Ponemos una pieza “Player(X).Complete” por cadaPonemos una pieza “Player(X).Complete” por cada
reproductor, y la pieza “Player(X).Start” delreproductor, y la pieza “Player(X).Start” del
siguiente reproductor.siguiente reproductor.
 Se puede hacer que un texto vaya cambiando y te diga queSe puede hacer que un texto vaya cambiando y te diga que
canción está sonando, con un “Text Box” y las estas piezas,canción está sonando, con un “Text Box” y las estas piezas,
que están enque están en built in>textbuilt in>text y eny en my blocks>TextBox(X)my blocks>TextBox(X)
 Con esto puedes cambiarCon esto puedes cambiar
la imagen del botón parala imagen del botón para
saber cual es la que sesaber cual es la que se
está reproduciendo yestá reproduciendo y
devolver la imagen deldevolver la imagen del
que termino a la normal.que termino a la normal.

 Se necesita un botón, queSe necesita un botón, que
hará de pause, y las cancioneshará de pause, y las canciones
(y sus correspondientes(y sus correspondientes
botones de inicio).botones de inicio).
 Se pone la pieza general del botón, ySe pone la pieza general del botón, y
la pieza dela pieza de built in> controlbuilt in> control “if (X)“if (X)
then (Y)”.then (Y)”.
 En “if” ponemos la pieza deEn “if” ponemos la pieza de
“player(x).Playing”, y en “do” la de“player(x).Playing”, y en “do” la de
“player(X).Pause”.“player(X).Pause”.
 Se repite por cada reproductor,Se repite por cada reproductor,
dentro del mismo botón.dentro del mismo botón.
 Con esto puedes cambiarCon esto puedes cambiar
la imagen del botón,la imagen del botón,
cuando esta en pausa,cuando esta en pausa,
añadiendo la piezaañadiendo la pieza
“component” de la“component” de la
imagen.imagen.

 Mismos elementos que en el anterior,Mismos elementos que en el anterior,
pero el botón servirá de Stop.pero el botón servirá de Stop.
 Colocamos la pieza general del botón, y lasColocamos la pieza general del botón, y las
piezas “player(x).Stop”piezas “player(x).Stop”
de todos los reproductoresde todos los reproductores
que tengamos. Simple.que tengamos. Simple.

Emular a un dispositivoEmular a un dispositivo
 Como es difícil saber que se está haciendo, oComo es difícil saber que se está haciendo, o
si funciona, antes de empaquetar todo, sesi funciona, antes de empaquetar todo, se
puede emular únicamente la pantalla en la quepuede emular únicamente la pantalla en la que
se esta trabajando desde un dispositivose esta trabajando desde un dispositivo
android, vía Wifi.android, vía Wifi.
 Desde el editor de bloques pulsamos “newDesde el editor de bloques pulsamos “new
emulator” y después en “connect to device”emulator” y después en “connect to device”
 Hay dos formas, mediante un código, queHay dos formas, mediante un código, que
debemos meter en la app previamentedebemos meter en la app previamente
descargada al dispositivo desde el market, odescargada al dispositivo desde el market, o
leyendo un código QR que nos da.leyendo un código QR que nos da.

EmpaquetarEmpaquetar
 Una vez acabado todo el trabajo, pulsamosUna vez acabado todo el trabajo, pulsamos
en “save”, desde el editor de bloques, yen “save”, desde el editor de bloques, y
desde la pagina Web pulsamos endesde la pagina Web pulsamos en
“Package for phone”, dándonos varias“Package for phone”, dándonos varias
opciones:opciones:
 Descargar la app al dispositivo leyendo unDescargar la app al dispositivo leyendo un
código de barras QR, descargando elcódigo de barras QR, descargando el
archivo .apk al ordenador, o directamentearchivo .apk al ordenador, o directamente
instalándola en el dispositivo conectadoinstalándola en el dispositivo conectado
desde el editor de bloques.desde el editor de bloques.

DistribuciónDistribución
 Una vez comprobado que la app cumple loUna vez comprobado que la app cumple lo
que se quería se puede poner al publico,que se quería se puede poner al publico,
para que pueda descargarla y probarla.para que pueda descargarla y probarla.
 Dos opciones:Dos opciones:
– El market oficial, pagando 25€ de entrada.El market oficial, pagando 25€ de entrada.
– Un market alternativo, como aptoide.com o laUn market alternativo, como aptoide.com o la
propia galería de appinventor, siempre quepropia galería de appinventor, siempre que
cumpla los requisitos:cumpla los requisitos:
http://gallery.appinventor.mit.edu/#http://gallery.appinventor.mit.edu/#

App ejemploApp ejemplo
 La app usada para los ejemplo a sidoLa app usada para los ejemplo a sido
Manganimeastur:Manganimeastur:
http://rotura.store.aptoide.com/app/market/appinventor.ai_enolmbgi2http://rotura.store.aptoide.com/app/market/appinventor.ai_enolmbgi2
6.Manganimeastur/1/3114237/Manganimeastur#6.Manganimeastur/1/3114237/Manganimeastur#
 Desde la aplicación aptoide, añadir repositorio rotura.(lo que teDesde la aplicación aptoide, añadir repositorio rotura.(lo que te
ponen) y al cargar saldrá la app.ponen) y al cargar saldrá la app.
 Autoría de la app propia. Se permiteAutoría de la app propia. Se permite
libre distribución, siempre bajo mismolibre distribución, siempre bajo mismo
copyright y nombrando al autor.copyright y nombrando al autor.

Tutorial apptoide

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (16)

Similar a Tutorial apptoide

Similar a Tutorial apptoide (20)

Tutorial apptoide