Bienvenidos a este videotutorial donde vamos a aprender los primeros pasos para desarrollar aplicaciones con app Inventor. App Inventor es una aplicación en modo web desde la que podemos desarrollar de una manera fácil y sencilla aplicaciones web que puedan ser ejecutadas tanto en dispositivos Android como en dispositivos de tipo iOS, de una manera sencilla sin necesidad de llegar a programar si no es necesario.
Para empezar a desarrollar con app Inventor tenemos que entrar su página, para poder empezar a desarrollar tenemos que pulsar donde pone Create app y antes de este paso tenemos que tener una cuenta de gmail para poder trabajar.
Cuando entremos nos va a pedir con qué cuenta de google queremos entrar, en este caso ya la habíamos seleccionado y nos va a pedir que ingresemos los términos de servicio de esta aplicación.
Lo que va a hacer es llevarnos a un entorno que es el diseñador de proyectos. Nos da un pequeño aviso de posibles cambios, modificaciones o mejores, si no queréis que vuelva a aparecer le dais a «do not show again» y continuar.
Una vez que tenemos la pantalla de trabajo de app inventor lo primero que tenemos que hacer es crear un nuevo proyecto, aquí nos aparecerían todos los proyectos que hayamos empezado, pero como no tenemos ninguno le damos al botón de la parte izquierda donde pone «start new project» y creamos proyecto1 le damos al ok y con esto nos aparece una ventana que es la ventana donde vamos a poder diseñar las aplicaciones.
Una de las cosas más interesantes de app inventor es que no es necesario saber programar para hacer gran parte de la aplicación sino que sencillamente dentro de esta pantalla que es una pantalla de tipo diseño vamos a poder ir arrastrando los elementos y vamos a poder ir personalizándolos sin necesidad de desarrollar ningún tipo de código.
En este primer tutorial vamos a ver un poco la pantalla y cómo la podemos utilizar podemos comprobar que tenemos en la parte izquierda una paleta, con los distintos objetos que podemos ir arrastrando al viewer (un simulador de teléfono) en el que vamos a poder ir arrastrando componentes para poder empezar a desarrollar.
En la paleta vemos que tenemos el user interface, objetos de tipo layout de tipo multimedia, de tipo almacenamiento, etc. Tenemos a nuestra disposición un conjunto de objetos bastante interesantes, en esta caja nos van a aparecer los componentes que vamos a ir arrastrando de la parte de la paleta al visor. Y en la parte de la derecha final tendremos la ventana de propiedades del objeto que tengamos en ese momento seleccionado en el visor.
Como veis, con estas propiedades podemos cambiar de manera rápida y sencilla el objeto con el que estemos trabajando. Por ahora podemos comprobar que en la pestaña de componentes tenemos un objeto denominado Screen que ahora mismo está indicando lo que sería la pantalla completa del teléfono.
Si queremos arrastrar algo aquí, es bastante sencillo, nos vamos a la paleta izquierda, seleccionamos uno de los objetos. Por poner un primer ejemplo vamos a coger user interface y arrastramos una label (un objeto que nos muestra un texto, un contenido) para trabajar con él es bastante fácil. Lo arrastramos a la parte de la pantalla que queremos y lo soltamos.
Evidentemente, como todavía no tenemos nada y tampoco hemos puesto el layout (que ya veremos que son contenedores de objetos) pues la etiqueta se nos queda en la parte superior. Podemos comprobar que también se ve reflejada en la caja de componentes. Si arrastro otra etiqueta vemos que la puedo colocar debajo.
Ahora mismo y tal y como tenemos la pantalla, sólo nos va a dejar poner componentes en forma horizontal. Vemos que según vamos pinchando en la ventana de componentes se va cambiando y aquí (izquierda) podré poner algunas de las propiedades de este objeto. Tipo de letra, negrita, italics, etc. Puedo ir bajando y viendo que dependiendo del objeto tengo distintas propiedades. Uno de los más importantes de la etiqueta es la propiedad text, le voy a poner mi primera etiqueta.
Podemos ir arrastrando otro tipo de objetos como un botón, una vez que tengamos hecho esto, veremos a lo largo de otros tutoriales que podemos terminar de configurar nuestra aplicación y ejecutarla para poder empezar a trabajar y para poder en el caso final desplegarla en un móvil.
Os espero en el próximo videotutorial.