3.6 Dibujar un rectángulo: rect(x, y, width, height)

Para dibujar un rectángulo necesitaremos introducir cuatro parámetros: el primero y el segundo definen las coordenadas x e y de la esquina superior izquierda, el tercero en ancho y el cuarto la altura.

size(480, 120);
rect(180, 60, 220, 40);

En Processing 2 se añadieron nuevas características a la función rect(), permitiéndonos añadir bordes redondeados.

 En este caso, tendremos que añadir un quinto parámetro, en pixels, que redondeará nuestro rectángulo.

Si queremos que cada una de las esquinas de nuestro rectángulo tenga un redondeo diferente, podremos hacerlo añadiendo diferentes radios para cada una de ellas. Comenzando desde la esquina superior izquierda y en el sentido de las agujas del reloj, introduciremos valores para cada una de las esquinas.


rectMode()
Por defecto, nuestros rectángulos se dibujan siguiendo el orden de parámetros especificados arriba, pero en algunas circunstancias podemos necesitar modificar el modo de dibujo.

Para ello existe la función rectMode() que modifica el modo en el que serán dibujados nuestros rectángulos. Podemos introducir tres valores en mayúsculas: CORNER, CORNERS, CENTER.

· CORNER: Es el modo por defecto, y el que hemos aprendido arriba. (x, y, width, height).
rectMode(CORNER);

· CORNERS: 1º y 2º parámetro = esquina superior izquierda. 3º y 4º parámetro = esquina inferior derecha.
rectMode(CORNERS);

· CENTER: Utiliza el primer y el segundo parámetro para establecer el centro del rectángulo, y el tercer y el cuarto parámetro como la anchura y la altura.
rectMode(CENTER);