Scratch- ja Processing-ohjelmoinnin vertailua

PÄÄLOHKOT


Jos luomme Scratch-ohjelmassa käynnistyslohkon ja lisäämme siihen ikuisesti silmukan, niin se vastaa Processing- ohjelmoinnissa void draw () - lohkoa. Kun komennot laitetaan ennen ikuisesti silmukkaa, niin se on sama kuin laittaisimme komennot void setup ()-lohkoon.

void setup () {
}
void draw () {
}

 

KOORDINAATISTO



Scratchissa on käytössä koordinaatisto, jossa origo on ikkunan keskellä ja x:n arvot vaihtelevat arvosta -240 arvoon 240 ja arvosta -180 arvoon 180. Samanlainen koordinaatisto saadaan aikaiseksi Processing-kielessä seuraavasti.

void setup () {
size(480,360);
}

void draw () {
translate(240,180);
scale(1,-1);
}

 

HAHMON LATAAMINEN

Scratchissa ohjataan hahmoa koordinaatistossa. Hahmo on oletuksena Scratch-kissa, joka on kuvatiedosto, jonka koko on 100 x 100 px. Processing ohjelmassa kuva voidaan ladata ja asettaa ikkunan keskelle seuraavasti.

PImage kuva;
void setup () {
size(480,360); // Koordinaatiston koko
background(255); // Taustaväri valkoinen
kuva = loadImage("kissa.png"); // Lataa kissan kuvan muistiin
}

void draw () {
translate(240,180); // Origo ikkunan keskelle
image(kuva,-50,-50,100,100); // Näytä 100x100 kokoinen kuva paikassa (-50,-50).
}


Tallenna ensin kissan kuva samaan paikkaan kuin on Processing-ohjelma koodi tallennettu. Ohjelman suoritus näyttää nyt tältä.



Hahmosta voidaan tehdä oma aliohjelmansa. Oletetaan, että meillä on Scratchin mukainen koordinaatisto, niin silloin aliohjelmassa hahmo, joudumme ottamaan peilikuvan hahmosta, koska muutoin kuva piirretään ylösalaisin.

PImage kuva;
int laskuri = 0;
void setup () {
size(480,360); // Ikkunan koko
background(255); // Taustaväri valkoinen
kuva = loadImage("kissa.png"); // Kuva muistiin
}

void draw () {
translate(240,180); // Origo ikkunan keskelle
scale(1,-1); // Peilaa y-koordinaatit
hahmo(); // Piirrä hahmo
}

void hahmo() {
pushMatrix(); // Koordinaatisto muistiin
scale(1,-1); // Peilaa y-koordinaatit
image(kuva,-50,-50,100,100); // Näytä kuva
popMatrix(); // Palauta koordinaatisto
}

 

KOODIN SAMANKALTAISUUS

Tehdään Scratchissa ohjelma, joka piirtää ympyrän silmukan avulla.



Samanlainen ympyrä samalla tekniikalla saadaan aikaiseksi Processing-ohjelmassa seuraavasti.

void setup() {
size(480,360); // Koordinaatiston koko
background(255); // pyyhi
fill(0,0,255); // aseta kynälle väri
noStroke(); // Piirrä ilman reunaviivaa
}

void draw () {
translate(240,60); // mene kohtaan x: y:
for (int a= 1; a<=360; a++) { // toista 360 kertaa
ellipse(0,0,10,10); // kynä alas, kynän koko 10
translate(2,0); // liiku 2 askelta
rotate(radians(1)); // käänny 1 aste
}
}

Huomataan selkeä samankaltaisuus. Nyt tulostuu seuraavaa.