Tomás Domínguez Mínguez - Processing

Tal como se ha dicho anteriormente, este triángulo podría describirse por las líneas que unen los vértices (30, 10), (50, 40) y (10, 40). En lenguaje Processing un vértice se declara con la función:

Puesto que la figura geométrica estará formada por un conjunto de vértices, todos ellos deberán ir agrupados dentro de las sentencias:

En resumen, el triángulo anterior se dibujaría con el siguiente código Processing.

Ponga en práctica todo lo aprendido dibujando un emoticono sonriente.

El código para hacerlo podría ser el siguiente:

En la primera línea de código se declaran las variables que identifican las coordenadas del centro del emoticono ( x, y) y su tamaño ( tamanioEmoticono).

En el bloque setup()se asignan los valores correspondientes a dichas variables, dando una tamaño de 400 píxeles al emoticono, que situará en el centro de una ventana de 600 × 600 píxeles utilizando las variables del sistema widthy height.

En el bloque draw()es donde realmente dibujará el emoticono. Para ello utilizará una secuencia de comandos que pintan un círculo para la cara, dos elipses para los ojos y un arco para la boca.

¿Se anima a dibujar otros nuevos emoticonos? Siga leyendo y verá cómo hacerlo, además de aprender a darles color.

Hasta ahora no se ha preocupado de indicar a Processing qué colores debía utilizar para dibujar los puntos, líneas o figuras geométricas que ha estudiado. Por defecto, las líneas las pinta en negro, igual que los puntos o el borde de las figuras. Para el relleno de las figuras utiliza el color blanco y para el fondo de la ventana un gris claro. Es momento, pues, de aprender a especificar los colores que se quiere utilizar en cada caso.

Para indicar a Processing un color usará la nomenclatura RGB (Red, Green, Blue), o lo que es lo mismo, los valores de la intensidad de los componentes rojo, verde y azul de un determinado color. Estos tres colores se consideran primarios porque cualquier otro color se puede obtener a partir de una composición de ellos. El valor de intensidad mínimo que pueden tener es 0 y el máximo 255.

Ejemplos de colores utilizando la nomenclatura RGB serían:

* Blanco: (255, 255, 255)

* Negro: (0, 0, 0)

* Rojo: (255, 0, 0)

* Verde: (0, 255, 0)

* Azul: (0, 0, 255)

* Amarillo: (255, 255, 0)

* Púrpura: (255, 0, 255)

* Cian: (0, 255, 255)

NOTA.Opcionalmente, un color se puede especificar con un cuarto parámetro que define la transparencia (alpha ). Los valores que puede tomar van desde 0 (completamente trasparente) a 100 (totalmente opaco).

Si le interesa un color, pero no sabe sus componentes RGB, Processing proporciona una herramienta para conocerlos. Para ello pulse en el menú Herramientas Selector de colores… Aparecerá la siguiente ventana:

Deslizando la barra vertical selecciona un color, para después, en la zona izquierda, elegir exactamente el tono que quiera. Los valores que busca aparecerán en los campos R, G y B.

Pero puede que no quiera dibujar en color sino en blanco y negro. En ese caso solo haría falta especificar el tono de gris a emplear con un único número, que variaría entre el 0 (negro) y el 255 (blanco). Por ejemplo:

* Blanco: 255

* Negro: 0

* Gris: 100

Ya sabe especificar un color, pero ¿a qué puede darle color en Processing? Al fondo de la ventana, al color con el que dibujará los puntos, las líneas y los bordes de las figuras, además del relleno de dichas figuras. Para ello, utilizará los siguientes comandos:

* background(color ).Establece el color de fondo de la ventana.

* stroke(color ).Define el color de las líneas y bordes de figuras.

* fill(color ).Fija el color de relleno de las figuras.

Estos comandos deberán preceder a aquellos en los que realmente se dibuje (ya sea un punto, una línea o cualquier figura). Se podrán usar las veces que quiera a lo largo del programa, permitiendo cambiar de color siempre que lo necesite, ya que cualquier comando de dibujo utilizará el color asignado inmediatamente antes por cualquiera de dichas funciones.

Preste especial atención al comando background(), ya que cuando se ejecute dentro del bloque draw()borrará todo lo que haya en la pantalla, dejándola con el color especificado. Esto es especialmente útil para imágenes en movimiento, ya que al borrar la anterior y mostrar la nueva, provoca la sensación de que la imagen cobra vida. Si, por el contrario, la interfaz de usuario fuera estática, sitúelo en el bloque de setup()para que, una vez establecido dicho fondo, no borre nada de lo que muestre después.

Finalmente, me gustaría matizar que si no quiere que Processing rellene de ningún color una figura use la sentencia: