Monimutkaisten kuvioiden liikuttelu

Entä jos halutaan ohjata monimutkaisempaa kuviota, esimerkiksi kuutiota. Tällöin kannattaa liikutella koko koordinaatistoa translate(a,b); -komennolla, missä muuttujalla a ilmaisee kuvion paikan vaakasuunnassa ja muuttuja b ilmaisee kuvion paikan pystysuunnassa. Tehdään kokonainen ohjelma, joka liikuttaa kuutiota. Lisätään ohjelmaan vielä ehto, että kuviota liikutellaan vain, jos näppäin on pohjassa. Kokonainen ohjelma näyttää tältä.

// Ohjelman tehnyt e-Oppi Oy

// 16.1.2018

int a = 100; // Kuvion aloituskohta vaakasuunnassa
int b = 100; // Kuvion aloituskohta pystysuunnassa 
void setup () {
     size(600,600);  // Ikkunan koko
     stroke(0,0,255);  // Reunaviivan väri sininen
     strokeWeight(10); // Reunaviivan paksuus 10
}

void draw () {
     background(255);  // Tyhjennä tausta

     if (keyPressed == true) {  // Jos näppäin on pohjassa
          if ((keyCode == RIGHT) && (key == CODED)) {   // Jos oikealle
               a++; // Niin kasvata laskuria a
          }
          if ((keyCode == LEFT) && (key == CODED)) { //Jos vasemmalle
               a--; // Niin pienennä laskuria a
          }
          if ((keyCode == DOWN) && (key == CODED)) { // Jos alas
               b++; // Niin kasvata laskuria b
          }
          if ((keyCode == UP) && (key == CODED)) { // Jos ylös
               b--; // Niin pienennä laskuria b
          }

     }

     pushMatrix();  // Koordinaatisto muistiin
     translate(a,b); // Liikuta koordinaatistoa
     line(100,100,200,100);
     line(200,100,250,50);
     line(100,200,200,200);
     line(200,200,250,150);
     line(100,100,100,200);
     line(200,100,200,200);
     line(150,50,150,150);
     line(250,50,250,150);
     line(150,50,250,50);
     line(150,150,250,150);
     line(100,100,150,50);
     line(100,200,150,150);

     popMatrix();  // Palauta koordinaatisto muistista
}

Käytännössä monimutkainen kuvio laitetaan seuraavan rakenteen sisään.

pushMatrix();

translate(x,y);

// Kuvion piirtokomennot tähän

popMatrix();