Interfaz de app inventor 2

8
Interfaz de APP Inventor 2

description

Nuestra APP: Diseñar nuestro interfaz básico

Transcript of Interfaz de app inventor 2

Page 1: Interfaz de app inventor 2

Interfaz de APP Inventor 2

Page 2: Interfaz de app inventor 2

¿Qué es App Inventor?Es un entorno de desarrollo de aplicaciones para dispositivos Android. Se trata de un servicio basado en la nube por lo que todas las tareas se realizan en un navegador (Google Chrome o Mozilla Firefox), de tal manera que todos los proyectos que se vayan realizando se quedan almacenados en la nube.

El interfaz de App inventor está formado por tres herramientas:● Gestor de proyectos: Donde se guardaran nuestros

proyectos.● Diseñador: Donde deseñaremos el interfaz de

nuestras aplicaciones● Editor de bloques: Donde programaremos las

acciones que se realizaran con el interfaz anteriormente diseñado.

Para poder acceder al servicio necesitas una cuenta de google.

Page 3: Interfaz de app inventor 2

Mis Proyectos (My Projects)La vista de los proyectos es la primera que se carga nada mas acceder a APP Inventor, en esta herramienta podemos realizar un seguimiento de todos nuestros proyectos.

Desde el botón My projects podemos acceder a los proyectos que tenemos guardados

Para crear un nuevo proyecto

Page 4: Interfaz de app inventor 2

Diseñador (Designer)La herramienta de diseño nos permite seleccionar los componentes de la App y definir el interfaz de usuario de la misma(botones, cuadros de texto, etiquetas, etc.)

Para poder incluir componentes al diseño de nuestra aplicación solo hay que seleccionar los componentes en la paleta y arrástralos al visor

Page 5: Interfaz de app inventor 2

Diseñador (Designer)La herramienta de diseño nos permite seleccionar los componentes de nuestra aplicación y definir el entorno de usuario de la misma.

Situa los componentes en el visor para establecer el aspecto de tu aplicación

A medida que incorpores componentes a tu aplicación se irán añadiendo a la lista de componentes

Situa los componentes en el visor para establecer el aspecto de tu aplicación

A medida que incorpores componentes a tu aplicación se irán añadiendo a la lista de componentes

En el panel media añadimos imágenes, sonidos o vídeos a nuestra App

Page 6: Interfaz de app inventor 2

Diseñador (Designer)

Y las propiedades del componente seleccionado aparecen en el panel

Seleccionas un componente de la lista

Para pasar al editor de Bloques

Page 7: Interfaz de app inventor 2

Editor de Bloques (Blocks)El comportamiento de nuestra aplicación se programa mediante bloques en el editor de bloques.

Encaja las piezas como en un puzle para establecer el comportamiento de la aplicación

Arrastra los bloques para utilizarlos en el programa

Page 8: Interfaz de app inventor 2

Editor de Bloques (Blocks)

Aquí están los bloques correspondientes a los componentes incluidos en la app

Aquí se encuentran los bloques de uso general