Processing

2. Setup i Draw

setup

La funció setup s'executa només una vegada quant el programa comença. Es solen iniciar els paràmetres d'inicialització en aquesta funció. Aquesta funció és opcional. Només pot haver-hi una funció setup en tot el programa.


void setup(){
  size(200, 100);
}

draw

La funció draw es crida justament després de la funció size. És una funció que es crida continuament en forma de bucle.


void setup(){
size(200, 100);
}

void draw(){
line (23,34,5,5);
}

background I

La funció background es sol utilitzar de dues formes. Definir-la en la funció setup. I per tant només es dibuixarà una vegada.


void setup(){
size(100, 50);
// Definim el fons blau
background(0,0,255);
}

void draw(){
// Dibuixem una circumferencia negre
fill(0);
ellipse (mouseX, mouseY, 15, 15);
}

background II

La segona forma d'utilitzar la funció background és a la funció draw. En aquest cas, la funció background s'executarà indefinidament.


void setup(){
size(100, 50);
}

void draw(){
// Definim el fons
background(#3F3F3F);
// Dibuixem una circumferencia negre
fill(0);
ellipse (mouseX, mouseY, 15, 15);
}

mouseX

La variable mouseX conté la coordenada X d'on es troba el mouse.


void draw()
{
  background(#3F3F3F);
  line(mouseX, 20, mouseX, 40);
}

mouseY

La variable mouseY conté la coordenada Y d'on es troba el mouse.


void draw()
{
  background(#3F3F3F);
  line(20, mouseY, 40, mouseY);
}

mousePressed

La funció mousePressed es crida quan s'apreta el botó del mouse.


int value = 0;

void draw() {
  fill(value);
  rect(25, 25, 50, 50);
}

void mousePressed() {
    value = 255;
}

mouseReleased

La funció mouseReleased es crida quan es deixa d'apretar el botó del mouse.


int value = 0;

void draw() {
  fill(value);
  rect(25, 25, 50, 50);
}

void mousePressed() {
    value = 255;
}
void mouseReleased() {
    value = 0;
}

print

La funció print s'utilitza per imprimir informació a l'àrea de la consola, que és el rectangle negre que es troba a sota de l'entorn de Processing.


int value = 32;

void setup() {
  // Imprimim un text
  print("Hola");
  // Imprimim una variable
  print(value);
  // Imprimim un literal
  print(43);
}

println

La funció println s'utilitza per imprimir informació a l'àrea de la consola, però afegint un salt de línea al final.


int value = 32;

void setup() {
  // Imprimim un text
  println("Hola");
  // Imprimim una variable
  println(value);
  // Imprimim un literal
  println(43);
}

Imprimir la posició del mouse

Com imprimirieu la posició del mouse cada cop que canvia de posició?

¿?

Fer l'ullet

Canvis en la cara

Canvieu el codi següent per fer que l'altre ull també es mogui. Intenteu moure més elements de la cara.


void setup()
{
size(200,200);
smooth();
}
void draw()
{
background(255);
fill(255,217,0);
ellipse(100,100,175,175);
fill(0);
ellipse(65,65,20,mouseY/10);
ellipse(135,65,20,20);
noFill();
arc(100,100, 125, 125,radians(0), radians(180));
}

deures

Animeu la cara que vau fer la setmana passada. Podeu animar molts aspectes de la cara utilitzant els events del ratolí i variables.