Creatividad Matemática

 En esta sección seguiremos trabajando con nuestra aplicación, solo que aquí aplicaremos una nueva actividad, en donde nuestro nivel irá subiendo un poco, todo para lograr realizar algo cada vez más matemática, ¡pon mucha atención!

Comenzaremos al igual que como lo hicimos en el trabajo anterior, en donde te iré guiando paso a paso, y mostrando como debe ir quedando nuestro trabajo.

1. Ingresamos a nuestra aplicación como ya sabemos usar, y como nombre al proyecto le pondremos: creatividad_y_matematica

2. Lo primeros que realizaremos será crear una aplicación en donde se nos permita dibujar en ella, de esta manera podremos ir jugando con dibujos matemáticos, formas, figuras, etc. Todo como si fuera nuestra pizarra blanca.

Como trabajamos la ventana anterior, lo primero que hacemos es ir hacia la paleta y agregar un Lienzo esta opción la encontramos en dibujos y animación. 

Ahora nos vamos hacia el otro lado para las Propiedades, en donde configuraremos de la siguiente manera nuestro lienzo: alto 300 pixeles, y ancho ajustar al contenedor. Es importante que el alto vaya en esa medición pues vamos a utilizar el otro lado restante para incluir algunos botones para nuestra pintura.

Luego, en la Paleta nos vamos a ''Disposición''' y seleccionamos la tercera opción que es ''Disposición tabular'', ya que comenzaremos a ver la opción de los botones. Una vez encontrada la opción la deslizamos hasta la parte inferior (bajo el lienzo) y nos vamos a Propiedades de esta opción.

En propiedades debemos colocar: columnas=5 y en registros=1. De esta manera podremos poder configurar nuestros botones posteriormente. En las columnas irán agregados los colores de nuestra paleta más los botones de los comandos que agregaremos. La altura quedará automática y el ancho, le damos ajustar al contenedor.

Nos regresamos a Paleta y vamos a Interfaz de Usuario, en donde nos encontraremos los botones que vamos a operar, lo que haremos es deslizar uno agregándolo a la sección pequeña que agregamos con la disposición tabular. 

Agregaremos primero 3 bloques los cuales los editaremos para poder generar el color. Por eso, deslizaremos 3 botones, los cuales todos tendrán la misma configuración en propiedades, excepto el color que les daremos. Su configuración será:

-Alto: ajustar al contenedor.

-Ancho: 30 pixeles.

En la sección de texto, eliminamos el texto pues no es estrictamente necesario que estos tengan. Esta configuración la realizaremos con los tres botones, la única diferencia será que al comienzo de la configuración aparece color de fondo, y en cada bloque colocaremos un color distinto: negro, azul y rojo.

Ahora haremos dos botones más que uno será el borrar (para borrar lo que vayamos haciendo y no nos guste) y el guardar (para almacenar nuestro progreso), para añadirlos, se hace exactamente igual a lo anteriormente hecho, añadimos  2 botones, y a ambos les daremos esta configuración: alto=ajustar al contenedor; ancho=105 pixeles. a uno, le colocaremos en el texto BORRAR y al otro GUARDAR. Así debe verse nuestro trabajo.

Ahora necesitamos un notificador, ya que iremos guardando nuestro progreso. En la misma interfaz encontramos la opción ''Notificador'' la cual deslizamos para seleccionar. Este elemento no lo visualizamos en nuestro progreso desde el navegador, es un elemento oculto que luego podremos ver al momento de ejecutar.

Ahora comenzaremos a programar, para eso vamos a cambiarle el nombre a nuestros botones así nos recordamos cuál es cuál. En la parte de abajo de los componentes, encontramos la opción de cambiar nombre.

Antes de comenzar a avanzar, es necesario que guardes tu trabajo. 

Seguimos, vamos a las opciones de bloques, y nos vamos a lienzo, donde pondremos las opciones para poder comenzar a dibujar. En primer lugar tocamos y deslizamos el bloque ''Cuando, lienzo arrastrado'' y necesitamos otra opción más que será la que nos permitirá dibujar, esta es ''llamar, lienzo. dibujar linea''.  

Luego, como vemos debemos anclar ciertos bloques más para que la función nos vaya ejecutando, por lo que debemos agregar ''tomar...'' según respectivo casillero, para obtener este conector, mantenemos el mouse encima de alguna opción como ''xinicial'' y nos irá apareciendo. Las opciones que debemos agregar según el conector son:

-en x1: tomar xprevio

-en y1: tomar yprevio

-en x2: tomar xactual

-en y2: tomar yactual

Esta instrucción es la que va permitir que se dibuje un punto o en teoría, la línea. Nos debe quedar nuestros bloques de esta manera:

Ahora veremos cómo borrar, para eso, nos vamos hacia nuestro botón borrar en la sección de bloques, y buscaremos la variable o el bloque de unión ''cuando nuestro botón borrar le hacemos clic'', nos falta una conexión, para esa, nos vamos a nuestro lienzo a buscar el conector ''llamar lienzo, limpiar''.

Nos queda de la siguiente manera:

Siguiente parte, hacer que se cambien los colores. Nos vamos a ir a un bloque de color, en este caso el negro (siguiendo en la sección bloques), y vamos a buscar ''cuando al botón negro le hagamos clic'', luego le vamos a pedir al lienzo que cambie su color a ese color, ¿Cómo lo hacemos?, vamos a lienzo buscamos la opción ''poner, lienzo,  color de pintura, como'' luego nos falta unirle el color, para encontrarlo, vamos a la sección bloques para visualizar todo, y vamos a Colores, ahí escogemos nuestro color, en este caso negro y lo anclamos.

Nos quedan los bloques de la siguiente manera;

Para que nos funcionen los demás colores debemos de realizar el mismo procedimiento, con los dos colores restantes. Así mismo, tú puedes agregar todos los colores que gustes, como así también cuántas cantidades de bloques como gustes.

Ahora veremos el cómo generar el guardar, nos vamos a la parte de bloques y luego al botón de guardar, y arrastramos el botón que sale cuando le hacemos clic, y ahora será útil la función que teníamos reservada anteriormente de notificador, le hacemos clic a notificador y buscamos el cuadro de diálogo de texto, habrán muchas opciones pero la que nos sirve en este caso es la que dice mostrar diálogo texto. 

Ahora lo que vamos a hacer es darle cuál es el texto que va a aparecer, por eso, en la sección de bloques vemos la categoría ''texto'' y buscamos el apartado que tiene unas comillas nada más y un espacio, lo arrastramos y lo anclamos a la parte de mensaje, donde podemos agregarle algo con relación a lo que  guardarán, en este caso pondremos ''nombre de tu archivo''.

En la parte donde dice título, agregaremos y anclaremos el mismo bloque de la sección anterior, en donde colocaremos ''guardar'', en la opción última donde sale cancelable, tenemos que fijarnos que esté la opción ''cierto'' (no te preocupes que esta función y bloque aparece automático, no debes anclarlo tú). Nos queda de la siguiente manera:

La manera en que debiera respondernos el notificador, es que cuando nosotros presionemos guardar, la máquina manda a llamar el cuadro de diálogo con dichos textos, entonces el sistema lo que va a hacer es ejecutar un notificador seguido,. Para que guarde ese nombre que uno le haya dado vamos a hacer los siguiente.

Nos vamos a bloques y el notificador, buscamos la opción cuando el notificador después de entrada de texto, lo arrastramos. Ahora a este debemos anclarle una opción que se llama ''evaluar pero ignorar el resultado'', lo encontramos en bloques y luego en control, esta opción es porque, si le decimos cancelar y aparte no necesitamos que el notificador nos arroje resultado, si no que simplemente pase datos, entonces con esta opción nos ayuda en estos casos, que aunque ignora resultados, evalúa de igual manera,.

Lo que sigue es, que luego de evaluar ese resultado, nuestro proceso llame al lienzo y salve o guarde el archivo con el nombre que le haya pasado la persona anteriormente. Entonces, abajo de bloques, nos vamos a lienzo y buscamos la opción que indica ''llamar lienzo, guardar como, nombre del archivo''.  Para el botón a anclar en nombredearchivo, si nos fijamos en nuestro primer bloque grande sale una opción pequeña que dice ''respuesta'', en ella dejamos nuestro mouse encima un momento y aparecerán dos opciones, seleccionamos tomar respuesta y esa es la que anclamos. 

Nos queda de la siguiente manera:

Lo que se dice con este último bloque es que después de que se haya introducido el texto mande a llamar a guardar como y le de el nombre que se le haya otorgado o designado a nuestro cuadro de texto.

¡Ahora puedes probarlo desde tu dispositivo y ver como va funcionando, recuerda siempre puedes hacerle arreglos, pero no olvides guardar todo!

Ahora, abriremos un nuevo trabajo y subiremos un poco el nivel, ya aprendimos a dibujar nosotros, hagamos programaciones para que comience esto a generarnos segmentos.

En primer lugar, creamos un nuevo proyecto al que llamaremos creacion_de_segmentos, y lo primero que debemos hacer es crear tres variables que necesitamos para poder indicar los puntos de inicio y de final del dicho segmento.

Como todo trabajo, debemos arrastrar un lienzo para poder trabajar y hacerle los ajustes en cuanto a ancha y largo, los cuales serán ajustar al contenedor.

Nos vamos directamente a la sección de bloques, y buscamos la opción variables donde insertaremos nuestras tres variables: inicio_x ; inicio_y ; activador. Estas tres variables nos permitirán dar inicio a nuestro trabajo 

Ponemos la opción inicializar global como, y copiamos tres veces esta opción, ambos inicios deben ser anclados a un valor 0, que encontramos en la sección matemáticas, en cambio el activador, lo anclamos a falso que se encuentra en las opciones de lógica. Debe verse de esta manera:

Las variables inicio_x e inicio_y almacenarán las coordenadas del punto de inicio, que es la posición del punto se obtiene cuando se toca por primera vez la pantalla del móvil. Estas serán variables globales de manera que sean reconocidas por todos los bloques y objetos. Serán inicializados en (0,0) que es el origen correspondiente al extremo superior izquierdo del Screen.

La variable activado cambia su estado a cierto después de hacer el primer toque en la pantalla y volverá a cambiar después de dibujar la línea. Es decir, nos indica si se está en modo de dibujar el segmento o no, o de otro modo, si se comenzó a dibujar el segmento.

Además de las variables creadas añadimos, las variables fin_x y también fin_y para guardar las coordenadas del segundo toque o del fin del segmento.

El algoritmo para dibujar una línea será el siguiente:

SI la variable activo es falsa entonces estamos realizando el primer toque a la pantalla por lo tanto debemos almacenar las coordenadas en inicio_x e inicio_y  y cambiamos el estado de la variable activado, ya entramos en modo de crear el segmento.  Si no preguntamos por la variable activado nuevamente para saber si estamos en modo segmento, si es cierta entonces estamos en el segundo toque, por lo tanto debemos almacenar las coordenadas del segundo toque en las variables fin_x y fin_y. Y luego llamar a Lienzo lienzo para que dibuje la línea. Después de dibujar la línea cambiamos el estado de la variable activado.

La siguiente figura muestra el código

Para conocer qué tipo de figura geométrica que se dibujará, necesitamos una variable que indique qué botón es el activo. Crear la variable figura e inicializarla en 1 para indicar que se dibujará una línea, en caso de círculo su valor deberá ser 2

Agregar el código correspondiente para dibujar un segmento o una circunferencia. El algoritmo de la circunferencia  es análogo al de la línea solo cambia la llamar Lienzo. DibujarCirculo

El radio deberá calcularse mediante la distancia entre las coordenadas de punto de inicio y el punto final del radio, en otras palabras más matemáticas: debe ser y  aplicarse la siguiente fórmula.

Quedando de esta manera en nuestros bloques:

Ahora, podríamos unir lo que aprendimos ahora con el círculo o con el segmento de recta, y unirlo a lo que aprendimos al comienzo de hacer una aplicación para dibujar, borrar y guardar.

La siguiente misión deberás de realizarla solo/a, en donde deberás repetir los pasos de la primera actividad de dibujo, y debes añadirle para poder dibujar y los botones que vimos. Para que así con este programa que vimos para crear segmentos, pueda utilizarse el pintar.

Tus bloques y procedimientos deben verse muy similares a los que usamos la primera vez, ya sea con los botones, el insertar colores y dibujar.

Te dejo una pista de como deben quedar tus bloques, no olvides que no necesariamente pueden ser esos colores, puedes usar más, solo recuerda que a cada botón le debes anclar un color, y cambiar botones, de esa manera no te arrojará error.

¡Diviértete y disfruta, espero tus respuestas!