Processing

7. Else If

Creat per Isaac Muro
Creative Commons Licence

Pinta el cercle si...


function setup(){
  createCanvas(600, 400);
}
function draw(){
  background(0);

  stroke(255);
  strokeWeight(4);
  noFill();

  if (mouseX > 300){
    fill(255,0,200);
  }

  ellipse(300,200,100,100);
}

Pinta el cercle si...

Pregunta

Com puc fer que quedi pintat d'un altre color quan no es compleix la condició?

Diagrama de fluxe Condició ifElse

flow diagram If

Pseudocodi


si (expressió booleana) llavors
  sentencia1;
  ...
  sentenciaN;
sino
  sentenciaA;
  ...
  sentenciaB;
fsi

Sintaxi en p5.js


if (expressió booleana) {
  sentencia1;
  ...
  sentenciaN;

} else {

  sentenciaA;
  ..
  sentenciaB;
}

Exemple de ifelse


if (mouseX < 100) {
  background(255,0,0);

} else {
  background(0,255,0);
}

Pinta el cercle ifelse...


function setup(){
  createCanvas(600, 400);
}
function draw(){
  background(0);

  stroke(255);
  strokeWeight(4);
  noFill();

  if (mouseX > 300){
    fill(255,0,200);
  } else{
    fill(0,255,50);
  }

  ellipse(300,200,100,100);
}

Pinta el cercle ifelse...

Pregunta

Com es poden escriure més condicions enllaçades?

Diagrama de fluxe Condició ifElseif

flow diagram If

Pseudocodi


si (expressió booleana) llavors
  sentencia1;
  ...
  sentenciaN;
sino si (expressió booleana) llavors
  sentenciaA;
  ...
  sentenciaB;
sino si (expressió booleana) llavors
  sentenciaA;
  ...
  sentenciaB;
sino
  sentenciaA;
  ...
  sentenciaB;
fsi

Sintaxi en p5.js


if (expressió booleana) {
  sentencia1;
  ...
  sentenciaN;

} else if(expressió booleana) {
  sentenciaA;
  ...
  sentenciaB;

} else {
  sentenciaA;
  ...
  sentenciaB;
}

Exemple de ifelseif


if (mouseX < 50) {
  ellipse(300, 200, 100, 100);
} else if (mouseX < 100) {
  rect(300, 200, 100, 100);
} else if (mouseX < 150) {
  line(0,0, width, height);
}

Pinta el cercle ifelseif


function setup(){
  createCanvas(600, 400);
}
function draw(){
  background(0);

  stroke(255);
  strokeWeight(4);
  noFill();

  if (mouseX < 50) {
    ellipse(300, 200, 100, 100);
  } else if (mouseX < 100) {
    rect(300, 200, 100, 100);
  } else if (mouseX < 150){
    line(0,0, width, height);
  } else{
		point(300,200);
	}
}

Pinta el cercle ifelse...

Pregunta

Que passa si no posem els elses?

Exemple de ifelseif


if (mouseX < 50) {
  ellipse(300, 200, 100, 100);
}
if (mouseX < 100) {
  rect(300, 200, 100, 100);
}
if (mouseX < 150) {
  line(0,0, width, height);
}

Pinta el cercle ifelseif


function setup(){
  createCanvas(600, 400);
}
function draw(){
  background(0);

  stroke(255);
  strokeWeight(4);
  noFill();

  if (mouseX < 50) {
    ellipse(300, 200, 100, 100);
  }
  if (mouseX < 100) {
    rect(300, 200, 100, 100);
  }
  if (mouseX < 150){
    line(0,0, width, height);
  }
}

Pinta el cercle ifelse...

Repte

Fes un sketch que utilitzi aquesta estructura de if else if, else if per crear un sketch que varii depenen de la posició X o Y del mouse.

THANKS