Material
Actividad de aprendizaje 1
Primeros Pasos con
App Inventor
Indice
Introducción 1. Android.
2. Introducción App Inventor.
3. Requisitos para la Configuración.
4. Configuración de App Inventor 2.
5. ¿Cómo empezar a crear con App Inventor?
6. ¿Cómo empezar a trabajar en APP Inventor?
7. Webgrafía:
Introducción
App Inventor 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 (rompecabezas), y así de esta manera comenzar los diseños y definir qué hará cada uno.
Sin embargo, App Inventor 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 App Inventor se puede crear fácilmente cualquier tipo de aplicación que imagines, desde los juegos más adictivos, aplicaciones para empresas y hasta aplicaciones de dibujo o aplicaciones que utilicen Mapas y GPS.
1. Android
Android es un sistema operativo basado en Linux diseñado principalmente para dispositivos móviles con pantalla táctil, como teléfonos inteligentes o tabletas, inicialmente desarrollado por Android, Inc. Google respaldó económicamente y más tarde compró esta empresa en 2005. Android fue presentado en 2007 junto la fundación del Open Handset Alliance: un consorcio de compañías de hardware, software y telecomunicaciones para avanzar en los estándares abiertos de los dispositivos móviles. El primer móvil con el sistema operativo Android fue el HTC Dream y se vendió en octubre de 2008.
2. Introducción App Inventor
App inventor es un framework creado inicialmente por el MIT (Instituto tecnológico de Massachusetts) y fue adoptado por google, para que cualquier persona con interés pueda crear su propia aplicación móvil, ya sea para su empresa, para su casa o por otros intereses.
Para crear una aplicación con app inventor se deben realizan dos pasos:
1) El diseño de la aplicación, en la que se seleccionan los componentes para su aplicación.
El entorno de desarrollo está dividido en dos apartados principales, el diseñador de las pantallas y el editor de bloques de código.
2) El editor de bloques, donde se escogen los bloques que sean necesarios según la aplicación que se vaya a crear.
Los bloques son parecidos a piezas de un puzzle (rompecabezas), cada pieza tiene unos “conectores” que permitirán enlazar con otras piezas para definir el comportamiento de la aplicación.
La aplicación aparecerá paso a paso en la pantalla del teléfono o Tablet a medida que se añadan piezas a la misma, para así ir probando el trabajo. Cuando haya se haya terminado, se puede empaquetar la aplicación y producir una aplicación independiente para instalar.
El entorno de desarrollo de App Inventor es compatible con Mac OS X, GNU / Linux y sistemas operativos de Windows, y varios modelos de teléfonos y tablets Android populares. Las aplicaciones creadas con App Inventor se pueden instalar en cualquier Teléfono o Tablet Android.
Antes de poder utilizar App Inventor, es necesario configurar el ordenador e instalar los archivos de instalación de App Inventor en el equipo.
3. Requisitos para la Configuración
Ordenador y sistema operativo.
∙ Macintosh (con procesador Intel): Mac OS X 10.5, 10.6
∙ Windows: Windows XP, Windows Vista, Windows 7
∙ GNU / Linux: Ubuntu 8 +, Debian 5 +
Navegador.
∙ Mozilla Firefox 3.6 o superior
Nota: Si está usando Firefox con el NoScript extensión, tendrás que girar la extensión de. Vea la nota en la página de resolución de problemas.
∙ Apple Safari 5.0 o superior
∙ Google Chrome 4.0 o superior
∙ Microsoft Internet Explorer 7 o superior
Comprobar la configuración de Java.
En este paso es necesario actualizar la máquina virtual de java del equipo a la última versión, así que se recomiendo descargar el componente e instalarlo. A continuación se presenta el link de descarga.
http://java.com/es/download/
3. Requisitos para la Configuración
Configurar su dispositivo móvil Android.
En esta sección, se debe asegurar de que el dispositivo móvil está listo para su uso con la aplicación de App Inventor. Esto implica la verificación de algunas opciones en la configuración. A continuación, conectar el dispositivo móvil al ordenador con un cable USB. Si se tiene sistema operativo Windows, se requiere instalar el controlador del respectivo dispositivo móvil.
Compruebe la configuración de su dispositivo móvil.
Para que el dispositivo móvil esté listo para trabajar con la aplicación de App Inventor, siga estos pasos:
1. Pulsar el botón Inicio para ir a la pantalla de su teléfono principal.
2. Pulsar el botón Menú, luego Configuración y, a continuación aplicaciones.
3. Si el dispositivo tiene un lugar desconocido de fuentes, se debe comprobar que está activada.
4. Configuración de App Inventor 2.
Dirección Web.
En este programa de formación virtual, se utilizará la versión 2.0 de App inventor, ya que esta versión permite la posibilidad de trabajar 100%
en la web y proporciona diversas formas de probar las aplicaciones. Para conocer mayores detalles de esta versión, se puede consultar en el siguiente link: http://ai2.appinventor.mit.edu/
NOTA: es necesario contar con una cuenta gmail o misena, para comenzar a programar.
Una vez configurada la aplicación App Inventor, se puede empezar a crear aplicaciones en cuestión de minutos.
El Diseñador y Editor de bloques se ejecutan ahora por completo en el navegador. (en la nube) Para ver la aplicación en un dispositivo mientras se construye (también llamada "Probando en vivo"), se deben seguir los pasos que se muestran a continuación.
1.- Si se está utilizando un dispositivo Android y se tiene una conexión inalámbrica a Internet (WiFi), se puede comenzar la creación de aplicaciones sin necesidad de descargar ningún software en su ordenador. Para esto se requiere instalar la aplicación Companion App Inventor en tu dispositivo. Se elige la opción uno. Es muy importante instalar esta aplicación.
2.- Si no se tiene un dispositivo Android, se tendrá que instalar el software en su ordenador para que pueda utilizar el emulador de Android en la pantalla del mismo. Aquí Elija la opción dos.
4. Configuración de App Inventor 2.
3.- Si no se tiene una conexión inalámbrica a Internet (WiFi), se debe instalar el software en la computadora, de modo que se pueda conectar al dispositivo móvil Android a través de conexión USB. Se elige la opción tres. La opción de conexión USB puede algunas veces ser complicada, especialmente en Windows. Se debe usar este tipo de conexión como un último recurso.
1. Toque en el Desarrollo.
2. Hay que asegurarse que la USB debugging y stay awake esten activadas.
Si el dispositivo móvil está en la pantalla de bloqueo, lo debo desbloquear como se haría en el modo de ¨listo para ejecutar una aplicación¨. Ahora el cable USB se conecta en el dispositivo móvil y la computadora. Dos mensajes de estado aparecerán en el dispositivo, en el área de notificaciones en la parte superior de la pantalla:
∙ USB conectado significa que el dispositivo está conectado a la computadora.
∙ Depuración USB conectado permite que App Inventor controle el dispositivo.
5. ¿Cómo empezar a crear con App Inventor?
Se empieza creando un nuevo proyecto, para ello se selecciona “Start New Project” desde el menú “Project”, el entorno le pedirá el nombre del proyecto, se puede introducir “Hola_mundo”. Si así lo estiman utilizar otro nombre, se debe tener en cuenta comenzar por una letra, seguido de ésta se pueden utilizar más letras, números o el guión bajo.
Ahora con la pantalla vacía, en la sección de propiedades se cambia “Title” y le colocan “Mi primera aplicación con App Inventor”. No tener encuenta si no se le habla de todas las propiedades aún, se irán conociendo durante el desarrollo del programa virtual.
De la paleta de componentes se arrastra un botón de la sección “User interface” hasta la pantalla y se deja que se posicione automáticamente.
El botón quedará seleccionado, utilizar el botón “Rename” de la lista de componentes de la pantalla para cambiar el nombre del botón.
6. ¿Cómo empezar a trabajar en APP Inventor?
6.1. Consultar la siguiente dirección URL: http://appinventor.mit.edu/
6.2. Luego presiona click en la opción de Color Verde Get Started
6. ¿Cómo empezar a trabajar en APP Inventor?
6.3. Dar Click en el botón superior derecho de color naranja CREATE
3. CREATE!
6. ¿Cómo empezar a trabajar en APP Inventor?
6.4. Si es la primera vez que se ingresa, se pedirá autorización para trabajar con
4. Cuenta google
6. ¿Cómo empezar a trabajar en APP Inventor?
6.4. Si es la primera vez que se ingresa, se pedirá autorización para trabajar con una cuenta google o en su defecto autenticación para la misma.
4. Cuenta google
6. ¿Cómo empezar a trabajar en APP Inventor?
6.5. En el siguiente paso se hace necesario aceptar los términos de uso para trabajar con App Inventor 2
5. Aceptar los términos de uso!
6. ¿Cómo empezar a trabajar en APP Inventor?
6.6. Si se realizan los pasos anteriores se tendrá acceso a APP Inventor
6. Con los pasos anteriores se tendrá acceso a app inventor.
!
6. ¿Cómo empezar a trabajar en APP Inventor?
6.7. Dar click en el menú superior Projects y luego dar click en Start New Project al cual se da el nombre: HolaSENA.
Se empieza creando un nuevo proyecto, para ello se selecciona “Start New Project” desde el menú “Project”, el entorno pedirá el nombre del proyecto, se puede introducir “Hola mundo”. Si se desea utilizar otro nombre se debe tener en cuenta comenzar por una letra, seguido de ésta se pueden utilizar más letras, números o el guión bajo.
7. a) Start New Proyect
7. b) “Hola mundo”
6. ¿Cómo empezar a trabajar en APP Inventor?
Ahora se tienes la pantalla vacía, en la sección de propiedades se cambia “Title” y se le escribe “Mi primera aplicación con App Inventor “. Hay otras propiedades aún, se irán conociendo a medida que avance el curso.
6.8. Al crearse un nuevo proyecto en App Inventor se muestra toda el área de trabajo
6. ¿Cómo empezar a trabajar en APP Inventor?
b) Se agrega un segundo label y se modifica su propiedad text por “Bienvenidos” además se aplica el color en la propiedad TextColor.
c) Se agrega el componente webViewer y se modifica la propiedad URL del objeto por “www.sena.edu.co”
d) En el área de components, dar click sobre el objeto screen1, y se modifica su propiedad BackgroundColor por Naranja o el color de que se prefiera, además se puede cambiar el encabezado en la propiedad Title.
7. Webgrafía
MIT App Inventor (2013). Consultado el 3 de Agosto de 2014, en http://appinventor.mit.edu/explore/
Tu App Inventor (2013). Consultado el 5 de Agosto de 2014, en http://www.tuappinvetorandroid.com/
Tu App Inventor (2013). Consultado el 7 de Agosto de 2014, en
http://www.mibqyyo.com/articulos/2014/05/13/app-inventor-2-crea-aplicaciones-android-sin-escribir-una-sola-linea-de-codigo/
