![Page 1: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/1.jpg)
Multimedia Technology 2Lessenreeks door Tom Luyten
voor Communicatie- en Multimedia Design Maastricht
Werkcollege 6
Eigen functies métparameters
Gebaseerd op het boek “Learning Processing” door Daniel Schiffman
En de PowerPoint van Donald W. Smith
![Page 2: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/2.jpg)
LESSON 3: Organisation
Functies (p. 101 120)
• Modulariteit
• Een functie declareren en definiëren
• Een functie aanroepen
• Parameters doorgeven
• Een waarde teruggeven
• Hergebruiken
Les 5 : Functies
![Page 3: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/3.jpg)
LESSON 3: Organisation
Functies (p. 101 120)
• Modulariteit
• Een functie declareren en definiëren
• Een functie aanroepen
• Parameters doorgeven
• Een waarde teruggeven
• Hergebruiken
Les 5 : Functies
![Page 4: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/4.jpg)
Nu, functies mét arguments:
Arguments zijn waarden die in de functie worden “gevoed”
We kennen arguments al vanuit bv. de ellipse() functie :
ellipse(100,100,50,50);
Tekent een cirkel op x 100, y 100, van 50 op 50 hoog.
Als we deze waarden aanpassen, zal de cirkel er anders uitzien.
De functie blijft hetzelfde (ellipse()).
Deze functie werkt dus met variabelen, die wij bij het aanroepen van de functie vullen.
Eigen functies
![Page 5: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/5.jpg)
de functie drawBlackCircle() werkt fijn,
maar als we nu een cirkels willen tekenen op verschillendeplaatsen zullen we een variabele moeten introduceren die we kunnen aanpassen. Anders moeten we voor elke cirkel een nieuwe functie schrijven (niet efficiënt)
We willen dus een functie
drawBlackCircle(10,50,100,100);
Waar dan de opgegeven waarden voor x,y,breedte,hoogte van onze zwarte cirkel staan.
Eigen functies
![Page 6: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/6.jpg)
Een functie zonder arguments
void drawBlackCircle(){
fill(0);
ellipse(50,50,20,20);
}
Herschrijven mét arguments
Eigen functies
![Page 7: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/7.jpg)
Void draw(){
drawBlackCircle(16); //tekent een cirkel met diameter van 16
}
Hoe ziet de bijhorende functie eruit?
void drawBlackCircle(int diam){
fill(0);
ellipse(50,50,diam,diam);
}
Eigen functies
Wat gebeurt er precies ?
2. Er wordt een
lokale variable
diam aangemaakt
1. drawBlackCircle
wordt aangeroepen in
de draw
3. De waarde 16
wordt naar de
lokale variabele
diam gekopieerd
4. De ellipse wordt
getekend op de
waarde die uit de
variabele diam
wordt gelezen (16)
5. Lokale variabele
diam wordt
verwijderd
![Page 8: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/8.jpg)
Void draw(){
drawBlackCircle(16); //tekent een cirkel met diameter van 16
}
Hoe ziet de bijhorende functie eruit?
void drawBlackCircle(int diam){
fill(0);
ellipse(50,50,diam,diam);
}
Eigen functies
![Page 9: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/9.jpg)
Eigen functies
![Page 10: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/10.jpg)
![Page 11: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/11.jpg)
Breidt het vorige voorbeeld uit naar meerdere variabelen: x,y en grootte
Zodat we met één functie drawBlackCircle(50,100,10);
Cirkels kunnen tekenen op een verschillende plaats, met een verschillende grootte.
Eigen functies
20 min.
![Page 12: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/12.jpg)
Volgorde van uitvoeren
![Page 13: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/13.jpg)
![Page 14: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/14.jpg)
Een kopie doorgeven (?)
![Page 15: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/15.jpg)
int num = 16;
void draw(){
drawBlackCircle(num); //tekent een cirkel met diameter van 16
}
Hoe ziet de bijhorende functie eruit?
void drawBlackCircle(int diam){
fill(0);
ellipse(50,50,diam,diam);
}
Eigen functies
Wat gebeurt er precies ?
2. Er wordt een
lokale variable
diam aangemaakt
1. drawBlackCircle
wordt aangeroepen in
de draw
3. De waarde 16 (die we uit num
halen) wordt naar de lokale
variabele diam gekopieerd
4. De ellipse wordt
getekend op de
waarde die uit de
variabele diam
wordt gelezen (16)
5. Lokale variabele
diam wordt
verwijderd
![Page 16: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/16.jpg)
int num = 16;
void draw(){
println(num)
tel3Op(num); //telt 3 bij een opgegeven getal
println(num);
}
void telOp(int waarde){
int som = waarde + 3;
println(som);
}
Eigen functies
2. Er wordt een
lokale variable
waarde
aangemaakt
1. tel3Op wordt
aangeroepen in de
draw
3. De waarde 16 (die we uit num
halen) wordt naar de lokale
variabele diam gekopieerd
4. De waarde + 3 wordt
opgeslaan in de lokale
variabele som6. Lokale variabele
diam wordt
verwijderd5. We printen de waarde van
som ter controle.
7. Is dewaarde in num
veranderd? Neen, want we
hebben hier nergens iets
naar opgeslaan.
![Page 17: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/17.jpg)
Als je een waarde doorgeeft naar een functie wordt hiervan een kopie gemaakt! De originele variabele (numin dit geval) blijft intact!
num is een GLOBALE variabele
newnum een LOKALE variabele is
10 wordt gekopieerd naar newnum,
hier worden bewerkingen gedaan
en er komt een nieuwe waarde uit.
Hoe kan je de uitkomst toch opslaan in je originele variabele?
Een kopie?
![Page 18: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/18.jpg)
Return type
![Page 19: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/19.jpg)
Vb. The random() functie. Als je deze gebruikt retourneert die een random waarde en slaat deze op in een variabele.
int tom = random(100);
Zélf een functie met een return type schrijven:
int sum(int a, int b, int c){
int total = a + b + c;
return total;
}
Return type
![Page 20: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/20.jpg)
Let op :
-void is int geworden (void betekent dus niets retourneren)
- de return is ALTIJD nodig
int sum(int a, int b, int c){
int total = a + b + c;
return total;
}
In draw call je dan:
int tom = sum(20,40,20);
println(tom);
Geeft dan 80 terug.
Return type
![Page 21: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/21.jpg)
Return type
![Page 22: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/22.jpg)
Oefening 7.8.
Schrijf een functie waar de temperatuur in Fahrenheit wordt omgezet naar Celcius.
C = (F – 32)*(0.55)
Return type
![Page 23: Processing Werkcollege 6 functies met parameters](https://reader034.vdocument.in/reader034/viewer/2022052623/559ece171a28aba80b8b458c/html5/thumbnails/23.jpg)
1. Haal de beweging en rand-test uit je monster
Door de relevante functies in commentaar te plaatsen.
2. Teken, aan de hand van een for loop en de functie “teken” van je monster, een rij monsters naast elkaar.
3. Optie = kan je de rij langer/korter maken naar gelang de grootte van je sketch ?
Opdracht
Hint: oefening 7-9 p.118 + learningprocessing.com