1.-
size(250, 250);
//Por defecto, processing coloca un borde pixeleado negro alrededor de sus graficas.
//la funcion noStroke() lo apagara.
noStroke();
//cambiar el fondo a negro. Lo que va () se puede cambiar para que resulte otro color.
background(0);
/*por defecto rectMode es CORNER (costado). Colocara al rectangulo en la parte superior izquierda, en los 2 primeros argumentos, y dibujara el ancho y alto desde aqui.
*/
//dibuja un rectangulo de 50 pixeles de ancho y 150 pixeles de alto
//costado superior izquierdo es de 75, 10
rect(90, 150, 90, 60);
//cambiemos rectMode a CENTER. Ahora el centro del rectangulo //esta en los primeros dos argumentos en la funcion rect
rectMode(CENTER);
//cambiaremos el "fill" del rectangulo a un gris claro
fill(255,228,75);
/*Dibujemos un rectangulo que sea de 40 pixeles de ancho y 55 pixeles de alto y su centro de 20, 100.
El borde izquierdo del rectangulo deberia tocar el lado izquierdo de la pantalla. Puedes ver por que? */
rect(20, 100, 40, 55);
/*Cambiemos el rectMode a CORNERS.
CORNERS nos permite dibujar un rectangulo definiendo la esquina izquierda superior y la esquina derecha inferior. Las otras dos esquinas pueden ser deducidas desde estas dos otras esquinas.
*/
rectMode(CORNERS);
//cambiar "fill" a un gris oscuro
fill(255,105,75);
//dibujar un rectangulo donde su esquina superior izquierda sea de 0,175
//y su esquina inferior derecha este a 200, 190
rect(10, 55, 100, 290);
2.-
size(600,600);
//Por defecto, processing coloca un borde pixeleado negro alrededor de sus graficas.
//la funcion noStroke() lo apagara.
noStroke();
//cambiar el fondo a negro. Lo que va () se puede cambiar para que resulte otro color.
background(237,255,62);
//Hagamos el circulo suave, por defecto, lucira un poco “duro”
smooth();
/*por defecto ellipseMode es CENTER. Quiero comenzar con CORNER.
Si una caja fuera a ser dibujada alrededor de la ellipse, el costado superior izquierdo de esa caja estaria en los primeros 2 argumentos
*/
ellipseMode(CORNER);
//dibuja una elipse que sea de 50 pixeles de ancho por150 pixeles de alto
//y el costado superior iquierdo de la caja este 75, 10
ellipse(150, 120, 80,250);
/*cambiemos ellipseMode atras a CENTER, por defecto.
Ahora el centro de la elipse esta situado en losprimeros 2 argumentos.
is placed at the first two arguments en la funcion ellipse().
Ancho y alto son son aun los mismos.
*/
ellipseMode(CENTER);
//cambiaremos el "fill" de la siguiente elipse a un gris claro
fill(0);
//hagamos que esta elipse luzca “dura”, apagaremos smooth() y lo llamaremos noSmooth().
noSmooth();
/*Dibujaremos una elipse que tenga 100 pixeles de ancho y 55 pixeles de alto y su centro este a 50, 100.
El lado izquierdo de la elipse deberia tocar el lado izquierdo de la pantalla.
Puedes ver por que?
Tambien fijate que parte de esta nueva elipse tapa parte de la elipse antigua, eso es porque processing pinta sobre cualquier imagen en el algoritmo.
*/
ellipse(50, 100, 100, 55);
//Mejor volvamos a smooth…
smooth();
/*Cambiemos el ellipseMode a CORNERS.
CORNERS nos permite dibujar una elipse definiendo la esquina izquierda superior y la esquina derecha inferior de su caja
*/
ellipseMode(CORNERS);
//cambiar "fill" a un gris oscuro
fill (255, 248, 220);
//dibujar un rectangulo donde su esquina superior izquierda sea de 0,175
//y su esquina inferior derecha este a 200, 190
// dibujar una ellpse donde su esquina superior izquierda sea de 0,155
//y su esquina inferior derecha este a 200, 190
ellipse(200, 155, 200, 190);
//dibujaremos una caja alrededor del ultimo circulo.
//es el mismo argumento que la elipse, pero usa rectMode y rect.
rectMode(CORNERS);
//apaga fill y enciende stroke con un grosor de 2 pixeles.
//de otra manera el rect's fill pintara sobre nuestra elipse!
noFill();
strokeWeight(2);
//deja stroke en blanco
stroke(255);
//dibuja un rectangulo con los mismos argumentos de la ultima elipse.
rect(30,25,150,150);
3.-
size(200,200);
//setea background a negro. Fijate que solo uso un argumento.
//Processing lo suficientemente inteligente para saber que 1 argumento significa un tipo de gris
background(255,255,255);
//apaga stroke
noStroke();
//cambia fill a rojo brillante
fill(0,0,0);
//dibuja un rectangulo rojo a la izquierda arriba
rect(12,134,42,90);
//cambia fill a un verde oscuro
fill(0,80, 0);
//dibuja un rect verde justo a la derecha de la derecha del anterior
rect(100,0,100,50);
//cambia fill a celeste
fill(150,150,255);
//dibuja un rect azul justo a la derecha del anterior
rect(200,0,100,50);
//cambia fill a un gris medio
fill (255, 248, 220);
//dibuja un gran rect justo abajo de los tres previos
rect(10,30,270,99);
