Dibujar a mano alzada

A pesar de que App Inventor está limitado en la creación de aplicaciones dada su simplicidad, esta permite cubrir un gran números de necesidades, lo cual es facilitado por su amigable entorno, con un lenguaje gratuito, y sus aplicaciones van dirigidas al sistema operativo Android. 

A continuación, con App Inventor diseñaremos un aplicación que nos permita dibujara mano alzada, ya sean segmentos, circunferencias y círculos. 

Primero debemos ingresar a https://appinventor.mit.edu/, y seleccionar "Create Apps!" e ingresar a tu cuenta, selecciona el idioma que más te acomode.

Si necesitas recordar cómo funciona la plataforma, te recomiendo visitar nuevamente la página ¿Cómo utilizar App Inventor?, para que sea más sencillo diseñar la aplicación.

    APLICACIÓN PARA DIBUJAR A MANO ALZADA
Al ingresar a la plataforma, podremos ver que al lado izquierdo está la Paleta, en medio el Screen y al lado derecho las Propiedades.Para comenzar con nuestra aplicación, debemos arrastrar un Lienzo desde la sección "Dibujo y animación" de la Paleta al Screen 1. Luego, en propiedades de Lienzo 1, el ancho y alto ajustarlo al contenedor. Esto significa que el lienzo adoptará el tamaño de la pantalla de nuestro smarphone.

Gracias al Lienzo podemos dibujar lo que queramos sobre él, permitiendo hacer puntos, líneas, circunferencias, entre otros. Para que logremos dibujar a mano alzada debemos comenzar a programar en bloques, esto significa que al tocar la pantalla se irá dejando rastro de lo que dibujemos. 

En el extremo derecho superior, seleccionamos bloques para comenzar a programar. Seleccionamos Lienzo 1 y aparecerán los bloques que controlan este, arrastramos al Visor el bloque CuandoLienzo1.Arrastrado

Luego, nuevamente en Lienzo 1, seleccionar llamar Lienzo1.DibujarLinea. Del bloque anterior selecciona x previo con modo tomar, para unirlo a x1, y así sucesivamente con  y1  y previo, x2 x actual, y2 y actual. Ajusta el bloque llamar Lienzo1.DibujarLinea con cuando Lienzo1.Arrastrado.

Volvemos al modo Diseño, para agregar dos botones de color al momento de dibujar. Para que estos botones estén alineados debemos agregar un contenedor, el cual se encuentra en Paleta/ Disposición. Selecciona DisposiciónHorizontal, arrástralo al Screen1, en propiedades ajusta al contenedor el largo de DisposiciónHorizontal.  Luego, en Interfaz de Usuario, arrastra dos botones. 

En Propiedades de los botones, cambiar el color y asignar el nombre según corresponda. 

Para poder ir cambiando el color al dibujar en el Screen 1, debemos realizar un algoritmo “cuando hacemos clic en el botón, el Lienzo cambia el color de la pintura por el color X”. Nos dirigimos a Bloques, seleccionamos Botón 1, arrastramos al Visor CuandoBotón1.Clic.

En Lienzo1, buscar el bloque Poner Lienzo1.ColorDePintura como, y ajustarlo con el bloque anterior, en Integrados/colores buscar el color que escogiste para el botón1 y ajustar. Luego con el clic derecho sobre este último bloque seleccionamos Duplicar, y cambiamos Boton1 por Boton2, y el color también debemos cambiarlo. 

Para lograr ver como va tu avance, en la parte superior selecciona Conectar, reiniciar conexión, y selecionar Emulador o Al Companion.