SlideShare uma empresa Scribd logo
1 de 12
UNIVERSIDAD TECNICA DE
AMBATO
NTICS II
INTEGRANTES:
CINTHYA VILLACIS
VIVIANA VILLA
2º “B” SISTEMAS
App Inventor
 App Inventor es un entorno de desarrollo visual para Android
originalmente propuesto por Google y finalmente implementado
por el MIT (Massachusetts Institute of Technology).
 Se encontrara muchas funciones ya definidas en forma de bloques
y la flexibilidad a la hora de combinarlas te permitirá potenciar al
máximo tu creatividad.
 Su carácter gratuito la hace recomendable para todo tipo de
usuarios.
 Lo ideal es que tengas unas mínimas nociones generales sobre
programación para poder diseñar más fácilmente el flujo de
acciones y comprender en profundidad la utilidad de cada
bloque, aunque no será necesario que modifiques el código
fuente.
PASOS A SEGUIR:
 1. Pon a punto el programa
 Visita en primer lugar la web oficial de App
Inventor. Necesitarás tener una cuenta
Google para acceder al servicio. App
Inventor está compuesto por un conjunto
de herramientas que abarcan las diferentes
tareas en la construcción de la aplicación:
diseño, definición del comportamiento y
simulación.
 Es necesario tener instalado Java y los
sistemas operativos soportados son Mac OS
X 10.5/10.6, Windows XP/Vista/7, Ubuntu 8+ y
Debian 5+.
 descargar del software de escritorio App
 simulará un dispositivo Android que podrás
manejar a través del ordenador como si de
un móvil real se tratara.
 El panel de diseño es accesible desde el
navegador. En la página principal, pincha en
Invent/Create Mobile Apps. En My Projects,
selecciona New e introduce un nombre para el
nuevo proyecto.
 En Palette/Basic, hallarás utilidades básicas
como botones, inserción de imágenes, cuadros
de texto, etiquetas… La subsección Media
contiene componentes como acceso a la
cámara de fotos y vídeo.
 Social incluye los elementos necesarios para
seleccionar contactos, números de teléfono de
la agenda, correos electrónicos.
 Sensors, por su parte, nos brinda la oportunidad
de utilizar sensores para obtener información tal
como la localización geográfica o la
orientación del dispositivo.
 Screen 1 en la sección Components. Establece una imagen de
fondo cargándola con BackgroundImage. Para que no se
distorsione, es conveniente que utilices un fondo plano o alguno de
los tamaños por defecto para este tipo de pantallas.
 carga también otra imagen en Icon para que sirva de gráfico
identificativo de la aplicación y marca en Scrollable si deseas
permitir el uso del scroll.
 . Elementos no visibles
 Se denominan no visibles porque no se muestran
físicamente en el panel de diseño, como por
ejemplo los archivos de sonido.
 agregar un fichero a través de la opción Source
en Media/Sound. El procedimiento para agregar
estos elementos es el mismo que para aquellos
visibles: arrástralo hacia el visor.
 Aparecerán listados en la parte inferior del panel,
bajo el epígrafe Non-visible components. Otros
elementos similares son Camera, Camcorder o
Player, al igual que todos los incluidos en la
sección LEGO MINDSTORMS.
 Editor de bloques
 utilizando para ello el botón que hemos creado y el
fichero de sonido cargado. Pincha en Open the Blocks
Editor. Se generará un fichero Java con extensión JNLP
que deberás guardar en tu PC. Ábrelo y accederás al
editor de bloques. Acude ahora a la pestaña My Blocks
y verás la lista de todos los bloques que hayas añadido
en el panel de diseño.
 Selecciona Button 1 y observa sus opciones, que
aparecerán en forma de piezas de puzzle. Hay tipos de
piezas que indican acciones y otras para componentes.
Tu misión es encajarlas para conseguir el
comportamiento deseado. Probemos a establecer que
al pinchar sobre nuestro botón se reproduzca nuestro
fichero de música. Para ello, une en el editor los bloques
Button1.Click con Sound1.Play y listo.
 EMULADOR
 Gracias al emulador, podremos desarrollar nuestras aplicaciones
incluso si no contamos con un smartphone o es de otra marca.
 l procedimiento para utilizar un móvil Android desde el editor es
análogo. Conéctalo al ordenador mediante un puerto USB y, antes
de iniciar la simulación, comprueba que tu configuración está
habilitada.
 CREAR LISTAS
 al panel de diseño para añadir el elemento ListPicker, que permite
la elección entre una serie de opciones.
 Después acude al editor de bloques para crear una variable
global, en nuestro caso Números, con Built-in/Definition/Variable.
 Empaqueta tu app
 Siguiendo procedimientos similares a los
explicados, poco a poco, puedes ir
añadiendo nuevas funciones. En el
panel de diseño, pincha en Add Screen
si quieres que tu aplicación contenga
más de una pantalla.
 ncontrarás tres opciones. La primer,
Show barcode generará un código QR
asociado a tu cuenta y aplicación y
para tu uso propio. Para bajarte el
programa a tu ordenador, escoge
Download to this computer y el código
fuente se guardará en forma de archivo
APK. Para descargarla en tu teléfono
inteligente.
PRECIO DE LA APLICACION
 Su precio es de 25 dólares y no existe cuota anual.

Mais conteúdo relacionado

Mais procurados (17)

App inventor
App inventorApp inventor
App inventor
 
App inventor primeros pasos i
App inventor   primeros pasos iApp inventor   primeros pasos i
App inventor primeros pasos i
 
Tutorial mit app inventor 2
Tutorial mit app inventor 2Tutorial mit app inventor 2
Tutorial mit app inventor 2
 
App Inventor: Ejercicio 2
App Inventor: Ejercicio 2App Inventor: Ejercicio 2
App Inventor: Ejercicio 2
 
Google app inventor
Google app inventorGoogle app inventor
Google app inventor
 
Interfaz de mit app inventor 2
Interfaz de mit app inventor 2Interfaz de mit app inventor 2
Interfaz de mit app inventor 2
 
Controles y Objetos Android Studio (Actualizada 2016)
Controles y Objetos Android Studio (Actualizada 2016)Controles y Objetos Android Studio (Actualizada 2016)
Controles y Objetos Android Studio (Actualizada 2016)
 
Guia iniciación App Inventor
Guia iniciación App InventorGuia iniciación App Inventor
Guia iniciación App Inventor
 
Android studio
Android studioAndroid studio
Android studio
 
Interfaces increibles en Android
Interfaces increibles en AndroidInterfaces increibles en Android
Interfaces increibles en Android
 
App inventor 2 (parte I)
App inventor 2 (parte  I)App inventor 2 (parte  I)
App inventor 2 (parte I)
 
Android studio
Android studioAndroid studio
Android studio
 
App inventor
App inventorApp inventor
App inventor
 
Primer Ejemplo de Proyecto en Android Studio
Primer Ejemplo de Proyecto en Android StudioPrimer Ejemplo de Proyecto en Android Studio
Primer Ejemplo de Proyecto en Android Studio
 
MTI App inventor: Conociendo el Entorno
MTI App inventor: Conociendo el EntornoMTI App inventor: Conociendo el Entorno
MTI App inventor: Conociendo el Entorno
 
Hola mundo
Hola mundoHola mundo
Hola mundo
 
Appinventor
AppinventorAppinventor
Appinventor
 

Destaque (20)

aprendido en word
aprendido en wordaprendido en word
aprendido en word
 
Water
WaterWater
Water
 
freiesMagazin 10-2011
freiesMagazin 10-2011freiesMagazin 10-2011
freiesMagazin 10-2011
 
Mobile Commerce & Mobile Werbeformen
Mobile Commerce & Mobile WerbeformenMobile Commerce & Mobile Werbeformen
Mobile Commerce & Mobile Werbeformen
 
LA FILOSOFÍA
LA FILOSOFÍALA FILOSOFÍA
LA FILOSOFÍA
 
Informatica tarea2
Informatica tarea2Informatica tarea2
Informatica tarea2
 
La familia, psico
La familia, psicoLa familia, psico
La familia, psico
 
Presencia Online en 4 Pasos
Presencia Online en 4 PasosPresencia Online en 4 Pasos
Presencia Online en 4 Pasos
 
Trabajos de daniel
Trabajos de danielTrabajos de daniel
Trabajos de daniel
 
Actividad 1.2
Actividad 1.2Actividad 1.2
Actividad 1.2
 
Studie: Individualisierung im Kundendialog
Studie: Individualisierung im KundendialogStudie: Individualisierung im Kundendialog
Studie: Individualisierung im Kundendialog
 
Rafael alejandro
Rafael alejandroRafael alejandro
Rafael alejandro
 
INFORMATICA EN LA EDUCACION
INFORMATICA EN LA EDUCACIONINFORMATICA EN LA EDUCACION
INFORMATICA EN LA EDUCACION
 
Rehabilitacion gonzález más
Rehabilitacion gonzález másRehabilitacion gonzález más
Rehabilitacion gonzález más
 
Clase inaugural
Clase inauguralClase inaugural
Clase inaugural
 
Ley organica
Ley organicaLey organica
Ley organica
 
Diapo de miguel
Diapo de miguelDiapo de miguel
Diapo de miguel
 
Clases tic
Clases ticClases tic
Clases tic
 
Kraut-Publishers-Kurzvorstellung
Kraut-Publishers-KurzvorstellungKraut-Publishers-Kurzvorstellung
Kraut-Publishers-Kurzvorstellung
 
Diapositivas de informatica
Diapositivas de informaticaDiapositivas de informatica
Diapositivas de informatica
 

Semelhante a App Inventor guía paso a paso

Semelhante a App Inventor guía paso a paso (20)

Aplicacion
AplicacionAplicacion
Aplicacion
 
Manual aplicaciones moviles cristian
Manual aplicaciones moviles cristianManual aplicaciones moviles cristian
Manual aplicaciones moviles cristian
 
Aplicaciones android
Aplicaciones androidAplicaciones android
Aplicaciones android
 
Aplicaciones Android
Aplicaciones AndroidAplicaciones Android
Aplicaciones Android
 
Trabajo de ntics ii
Trabajo de ntics iiTrabajo de ntics ii
Trabajo de ntics ii
 
Trabajo de NTICS II
Trabajo de NTICS IITrabajo de NTICS II
Trabajo de NTICS II
 
LAUNCHER.pptx
LAUNCHER.pptxLAUNCHER.pptx
LAUNCHER.pptx
 
Grupo 5 HERRAMIENTAS DE USUARIO FINAL
Grupo 5 HERRAMIENTAS DE USUARIO FINALGrupo 5 HERRAMIENTAS DE USUARIO FINAL
Grupo 5 HERRAMIENTAS DE USUARIO FINAL
 
Grabación de video y Screencasting
Grabación de video y ScreencastingGrabación de video y Screencasting
Grabación de video y Screencasting
 
Aplicaciones android
Aplicaciones androidAplicaciones android
Aplicaciones android
 
Aplicaciones android
Aplicaciones androidAplicaciones android
Aplicaciones android
 
tAplicaciones android
tAplicaciones androidtAplicaciones android
tAplicaciones android
 
266521557 apuntes-unidad-formativa-app-inventor
266521557 apuntes-unidad-formativa-app-inventor266521557 apuntes-unidad-formativa-app-inventor
266521557 apuntes-unidad-formativa-app-inventor
 
Guia generalandroidstudioseccion3.docx
Guia generalandroidstudioseccion3.docxGuia generalandroidstudioseccion3.docx
Guia generalandroidstudioseccion3.docx
 
Google app inventor a
Google app inventor aGoogle app inventor a
Google app inventor a
 
Multimedia 1 1101
Multimedia 1   1101Multimedia 1   1101
Multimedia 1 1101
 
PRACTICA I
PRACTICA IPRACTICA I
PRACTICA I
 
Wink 2.0 Interamericana
Wink 2.0 InteramericanaWink 2.0 Interamericana
Wink 2.0 Interamericana
 
Practicas
PracticasPracticas
Practicas
 
google app inventor
google app inventorgoogle app inventor
google app inventor
 

Mais de Vivi Villa

Mais de Vivi Villa (8)

Tarea1.3_VillaViviana
Tarea1.3_VillaVivianaTarea1.3_VillaViviana
Tarea1.3_VillaViviana
 
Web2.0
Web2.0Web2.0
Web2.0
 
Administración de Operaciones
Administración de OperacionesAdministración de Operaciones
Administración de Operaciones
 
Robótica
RobóticaRobótica
Robótica
 
Domotica
DomoticaDomotica
Domotica
 
Android
Android Android
Android
 
Android
Android Android
Android
 
Domotica
DomoticaDomotica
Domotica
 

Último

MacOS SISTEMA OPERATIVO CARACTERISTICAS.pptx
MacOS SISTEMA OPERATIVO CARACTERISTICAS.pptxMacOS SISTEMA OPERATIVO CARACTERISTICAS.pptx
MacOS SISTEMA OPERATIVO CARACTERISTICAS.pptxcalzadillasluis134
 
BBVA - GraphSummit Madrid - Caso de éxito en BBVA: Optimizando con grafos
BBVA - GraphSummit Madrid - Caso de éxito en BBVA: Optimizando con grafosBBVA - GraphSummit Madrid - Caso de éxito en BBVA: Optimizando con grafos
BBVA - GraphSummit Madrid - Caso de éxito en BBVA: Optimizando con grafosNeo4j
 
Webinar Resolucion2335 de 2023 Kubapp.pdf
Webinar Resolucion2335 de 2023 Kubapp.pdfWebinar Resolucion2335 de 2023 Kubapp.pdf
Webinar Resolucion2335 de 2023 Kubapp.pdfAnaRosaMontenegro
 
SISTEMA INTEGRADO DE ADMINISTRACION FINANCIERA - SIAF MODULO ADMINISTRATIVO
SISTEMA INTEGRADO DE ADMINISTRACION FINANCIERA - SIAF MODULO ADMINISTRATIVOSISTEMA INTEGRADO DE ADMINISTRACION FINANCIERA - SIAF MODULO ADMINISTRATIVO
SISTEMA INTEGRADO DE ADMINISTRACION FINANCIERA - SIAF MODULO ADMINISTRATIVOELIAMARYTOVARFLOREZD
 
Delitos informáticos en Slideshare.pptx
Delitos informáticos en  Slideshare.pptxDelitos informáticos en  Slideshare.pptx
Delitos informáticos en Slideshare.pptxmaykolmagallanes012
 
Tipos de pensamiento y pensamiento lógico
Tipos de pensamiento y pensamiento lógicoTipos de pensamiento y pensamiento lógico
Tipos de pensamiento y pensamiento lógicoMaxCaldern2
 
Estructura del lenguaje c++. Operaciones básicas y su jerarquía aplicada en e...
Estructura del lenguaje c++. Operaciones básicas y su jerarquía aplicada en e...Estructura del lenguaje c++. Operaciones básicas y su jerarquía aplicada en e...
Estructura del lenguaje c++. Operaciones básicas y su jerarquía aplicada en e...FabianCruz73
 
ISDEFE - GraphSummit Madrid - ARETA: Aviation Real-Time Emissions Token Accre...
ISDEFE - GraphSummit Madrid - ARETA: Aviation Real-Time Emissions Token Accre...ISDEFE - GraphSummit Madrid - ARETA: Aviation Real-Time Emissions Token Accre...
ISDEFE - GraphSummit Madrid - ARETA: Aviation Real-Time Emissions Token Accre...Neo4j
 
Graph Everywhere - Josep Taruella - Por qué Graph Data Science en tus modelos...
Graph Everywhere - Josep Taruella - Por qué Graph Data Science en tus modelos...Graph Everywhere - Josep Taruella - Por qué Graph Data Science en tus modelos...
Graph Everywhere - Josep Taruella - Por qué Graph Data Science en tus modelos...Neo4j
 
SQL server Analysis Services & SQL Server Reporting Services.pptx
SQL server Analysis Services & SQL Server Reporting Services.pptxSQL server Analysis Services & SQL Server Reporting Services.pptx
SQL server Analysis Services & SQL Server Reporting Services.pptxRAMIROANTONIOGALINDO
 
Instalacion de servicios windows, configuracion y aplicacion.
Instalacion de servicios windows, configuracion y aplicacion.Instalacion de servicios windows, configuracion y aplicacion.
Instalacion de servicios windows, configuracion y aplicacion.CZSOTEC
 

Último (11)

MacOS SISTEMA OPERATIVO CARACTERISTICAS.pptx
MacOS SISTEMA OPERATIVO CARACTERISTICAS.pptxMacOS SISTEMA OPERATIVO CARACTERISTICAS.pptx
MacOS SISTEMA OPERATIVO CARACTERISTICAS.pptx
 
BBVA - GraphSummit Madrid - Caso de éxito en BBVA: Optimizando con grafos
BBVA - GraphSummit Madrid - Caso de éxito en BBVA: Optimizando con grafosBBVA - GraphSummit Madrid - Caso de éxito en BBVA: Optimizando con grafos
BBVA - GraphSummit Madrid - Caso de éxito en BBVA: Optimizando con grafos
 
Webinar Resolucion2335 de 2023 Kubapp.pdf
Webinar Resolucion2335 de 2023 Kubapp.pdfWebinar Resolucion2335 de 2023 Kubapp.pdf
Webinar Resolucion2335 de 2023 Kubapp.pdf
 
SISTEMA INTEGRADO DE ADMINISTRACION FINANCIERA - SIAF MODULO ADMINISTRATIVO
SISTEMA INTEGRADO DE ADMINISTRACION FINANCIERA - SIAF MODULO ADMINISTRATIVOSISTEMA INTEGRADO DE ADMINISTRACION FINANCIERA - SIAF MODULO ADMINISTRATIVO
SISTEMA INTEGRADO DE ADMINISTRACION FINANCIERA - SIAF MODULO ADMINISTRATIVO
 
Delitos informáticos en Slideshare.pptx
Delitos informáticos en  Slideshare.pptxDelitos informáticos en  Slideshare.pptx
Delitos informáticos en Slideshare.pptx
 
Tipos de pensamiento y pensamiento lógico
Tipos de pensamiento y pensamiento lógicoTipos de pensamiento y pensamiento lógico
Tipos de pensamiento y pensamiento lógico
 
Estructura del lenguaje c++. Operaciones básicas y su jerarquía aplicada en e...
Estructura del lenguaje c++. Operaciones básicas y su jerarquía aplicada en e...Estructura del lenguaje c++. Operaciones básicas y su jerarquía aplicada en e...
Estructura del lenguaje c++. Operaciones básicas y su jerarquía aplicada en e...
 
ISDEFE - GraphSummit Madrid - ARETA: Aviation Real-Time Emissions Token Accre...
ISDEFE - GraphSummit Madrid - ARETA: Aviation Real-Time Emissions Token Accre...ISDEFE - GraphSummit Madrid - ARETA: Aviation Real-Time Emissions Token Accre...
ISDEFE - GraphSummit Madrid - ARETA: Aviation Real-Time Emissions Token Accre...
 
Graph Everywhere - Josep Taruella - Por qué Graph Data Science en tus modelos...
Graph Everywhere - Josep Taruella - Por qué Graph Data Science en tus modelos...Graph Everywhere - Josep Taruella - Por qué Graph Data Science en tus modelos...
Graph Everywhere - Josep Taruella - Por qué Graph Data Science en tus modelos...
 
SQL server Analysis Services & SQL Server Reporting Services.pptx
SQL server Analysis Services & SQL Server Reporting Services.pptxSQL server Analysis Services & SQL Server Reporting Services.pptx
SQL server Analysis Services & SQL Server Reporting Services.pptx
 
Instalacion de servicios windows, configuracion y aplicacion.
Instalacion de servicios windows, configuracion y aplicacion.Instalacion de servicios windows, configuracion y aplicacion.
Instalacion de servicios windows, configuracion y aplicacion.
 

App Inventor guía paso a paso

  • 1. UNIVERSIDAD TECNICA DE AMBATO NTICS II INTEGRANTES: CINTHYA VILLACIS VIVIANA VILLA 2º “B” SISTEMAS
  • 2. App Inventor  App Inventor es un entorno de desarrollo visual para Android originalmente propuesto por Google y finalmente implementado por el MIT (Massachusetts Institute of Technology).  Se encontrara muchas funciones ya definidas en forma de bloques y la flexibilidad a la hora de combinarlas te permitirá potenciar al máximo tu creatividad.
  • 3.  Su carácter gratuito la hace recomendable para todo tipo de usuarios.  Lo ideal es que tengas unas mínimas nociones generales sobre programación para poder diseñar más fácilmente el flujo de acciones y comprender en profundidad la utilidad de cada bloque, aunque no será necesario que modifiques el código fuente.
  • 4. PASOS A SEGUIR:  1. Pon a punto el programa  Visita en primer lugar la web oficial de App Inventor. Necesitarás tener una cuenta Google para acceder al servicio. App Inventor está compuesto por un conjunto de herramientas que abarcan las diferentes tareas en la construcción de la aplicación: diseño, definición del comportamiento y simulación.  Es necesario tener instalado Java y los sistemas operativos soportados son Mac OS X 10.5/10.6, Windows XP/Vista/7, Ubuntu 8+ y Debian 5+.  descargar del software de escritorio App  simulará un dispositivo Android que podrás manejar a través del ordenador como si de un móvil real se tratara.
  • 5.  El panel de diseño es accesible desde el navegador. En la página principal, pincha en Invent/Create Mobile Apps. En My Projects, selecciona New e introduce un nombre para el nuevo proyecto.  En Palette/Basic, hallarás utilidades básicas como botones, inserción de imágenes, cuadros de texto, etiquetas… La subsección Media contiene componentes como acceso a la cámara de fotos y vídeo.  Social incluye los elementos necesarios para seleccionar contactos, números de teléfono de la agenda, correos electrónicos.  Sensors, por su parte, nos brinda la oportunidad de utilizar sensores para obtener información tal como la localización geográfica o la orientación del dispositivo.
  • 6.  Screen 1 en la sección Components. Establece una imagen de fondo cargándola con BackgroundImage. Para que no se distorsione, es conveniente que utilices un fondo plano o alguno de los tamaños por defecto para este tipo de pantallas.  carga también otra imagen en Icon para que sirva de gráfico identificativo de la aplicación y marca en Scrollable si deseas permitir el uso del scroll.
  • 7.  . Elementos no visibles  Se denominan no visibles porque no se muestran físicamente en el panel de diseño, como por ejemplo los archivos de sonido.  agregar un fichero a través de la opción Source en Media/Sound. El procedimiento para agregar estos elementos es el mismo que para aquellos visibles: arrástralo hacia el visor.  Aparecerán listados en la parte inferior del panel, bajo el epígrafe Non-visible components. Otros elementos similares son Camera, Camcorder o Player, al igual que todos los incluidos en la sección LEGO MINDSTORMS.
  • 8.  Editor de bloques  utilizando para ello el botón que hemos creado y el fichero de sonido cargado. Pincha en Open the Blocks Editor. Se generará un fichero Java con extensión JNLP que deberás guardar en tu PC. Ábrelo y accederás al editor de bloques. Acude ahora a la pestaña My Blocks y verás la lista de todos los bloques que hayas añadido en el panel de diseño.  Selecciona Button 1 y observa sus opciones, que aparecerán en forma de piezas de puzzle. Hay tipos de piezas que indican acciones y otras para componentes. Tu misión es encajarlas para conseguir el comportamiento deseado. Probemos a establecer que al pinchar sobre nuestro botón se reproduzca nuestro fichero de música. Para ello, une en el editor los bloques Button1.Click con Sound1.Play y listo.
  • 9.  EMULADOR  Gracias al emulador, podremos desarrollar nuestras aplicaciones incluso si no contamos con un smartphone o es de otra marca.  l procedimiento para utilizar un móvil Android desde el editor es análogo. Conéctalo al ordenador mediante un puerto USB y, antes de iniciar la simulación, comprueba que tu configuración está habilitada.
  • 10.  CREAR LISTAS  al panel de diseño para añadir el elemento ListPicker, que permite la elección entre una serie de opciones.  Después acude al editor de bloques para crear una variable global, en nuestro caso Números, con Built-in/Definition/Variable.
  • 11.  Empaqueta tu app  Siguiendo procedimientos similares a los explicados, poco a poco, puedes ir añadiendo nuevas funciones. En el panel de diseño, pincha en Add Screen si quieres que tu aplicación contenga más de una pantalla.  ncontrarás tres opciones. La primer, Show barcode generará un código QR asociado a tu cuenta y aplicación y para tu uso propio. Para bajarte el programa a tu ordenador, escoge Download to this computer y el código fuente se guardará en forma de archivo APK. Para descargarla en tu teléfono inteligente.
  • 12. PRECIO DE LA APLICACION  Su precio es de 25 dólares y no existe cuota anual.