1 Functions

1 Functions - You wouldn't write a paper that was You...

Info iconThis preview shows page 1. Sign up to view the full content.

View Full Document Right Arrow Icon
This is the end of the preview. Sign up to access the rest of the document.

Unformatted text preview: You wouldn't write a paper that was You wouldn't write a paper that was just one long paragraph You'd have many paragraphs, each of which would focus on one topic It's the same in programs—we divide our program into chunks called functions Each function focuses on one job or task 1 Creating your own functions Creating your own functions Processing allows you to separate your program into different functions. This is one of the key elements of good style, and makes programs easier to understand, modify and reuse. A well designed function should do one thing; that is you should be able to describe what it does without using the word and or or. 2 setup() and draw() setup() Processing programs that use functions must contain two special functions called setup() and draw() Put things that happen only once at the beginning in setup() Put code that draws in draw() You may create as many additional functions as you want 3 Happy Face Example Happy Face Example Let's say I had a program that drew a happy face 4 Happy Face Example Happy Face Example Here's what it would look like separated into setup() and draw() functions void setup() { size(200,100); size(200,100); } void draw() { fill(255,255,0); fill(255,255,0); ellipse(100,50,80,80); ellipse(100,50,80,80); arc(100,50,60,60,PI/8,7*PI/8); } fill(0,0,0); fill(0,0,0); ellipse(85,40,10,15); ellipse(85,40,10,15); ellipse(115,40,10,15); ellipse(115,40,10,15); 5 The syntax of functions The syntax of functions void setup() { size(200,100); size(200,100); } For now, every function starts with void which void which marks the beginning of the head Then a name followed by parenthesis Curly braces mark the beginning and ending of the body of the function The head and body together are called the function definition 6 Happy Face Example Happy Face Example Here I've added my own face() and head() functions void setup() { size(200,100); size(200,100); } void draw() { head(); head(); face(); face(); } void head() { fill(255,255,0); fill(255,255,0); ellipse(100,50,80,80); ellipse(100,50,80,80); } void face() { arc(100,50,60,60,PI/8,7*PI/8); arc(100,50,60,60,PI/8,7*PI/8); fill(0,0,0); fill(0,0,0); ellipse(85,40,10,15); ellipse(85,40,10,15); ellipse(115,40,10,15); ellipse(115,40,10,15); } 7 Oops! What happened? Oops! What happened? void setup() { size(200,100); size(200,100); } void draw() { face(); face(); head(); head(); } void head() { fill(255,255,0); fill(255,255,0); ellipse(100,50,80,80); ellipse(100,50,80,80); } void face() { arc(100,50,60,60,PI/8,7*PI/8); arc(100,50,60,60,PI/8,7*PI/8); fill(0,0,0); fill(0,0,0); ellipse(85,40,10,15); ellipse(85,40,10,15); ellipse(115,40,10,15); ellipse(115,40,10,15); } 8 Auto­Format Auto­Format 9 Simple Animation Simple Animation We can take advantage of the way setup() and draw() work to create simple animations (demo) 10 Practice Quiz Question Practice Quiz Question Which picture matches the output of this program? void setup() { background(0,0,0); background(0,0,0); } void draw() { anotherMystery(); anotherMystery(); mysteryFunction(); mysteryFunction(); fill(255,0,0); fill(255,0,0); ellipse(50,50,40,40); ellipse(50,50,40,40); } void mysteryFunction() { fill(0,255,0); fill(0,255,0); ellipse(60,50,40,40); ellipse(60,50,40,40); } void anotherMystery() { fill(0,0,255); fill(0,0,255); ellipse(70,50,40,40); ellipse(70,50,40,40); } 11 the background drawn once the background drawn (leaves a trail of circles) int x = 0; void setup() { background(0,0,0); background(0,0,0); stroke(255,255,255); stroke(255,255,255); noFill(); noFill(); } void draw() { ellipse(x,50,20,20); ellipse(x,50,20,20); x = x + 5; 5; } 12 the background is drawnevery time the background is drawn the screen is drawn (no trail) int x = 0; void setup() { stroke(255,255,255); stroke(255,255,255); noFill(); noFill(); } void draw() { background(0,0,0); background(0,0,0); ellipse(x,50,20,20); ellipse(x,50,20,20); x = x + 5; 5; } 13 A black rectangle drawn every time A black rectangle drawn with opacity (faint trail) int x = 0; void setup() { stroke(255,255,255); stroke(255,255,255); noFill(); noFill(); background(0,0,0); background(0,0,0); } void draw() { fill(0,0,0,10); fill(0,0,0,10); rect(0,0,100,100); rect(0,0,100,100); ellipse(x,50,20,20); ellipse(x,50,20,20); x = x + 5; 5; } * thanks Arthur! 14 Checking the value in a variable Checking the value in a variable Apparently (15%2) + 27 is 28 15 Expressions vs. Literals Expressions vs. Literals These two function calls produce different output println("2 + 3"); println( 2 + 3); 16 Expressions vs. Literals Expressions vs. Literals These two function calls produce different output println("2 + 3"); //displays 2 + 3 println(2 + 3); //displays 5 17 Functions and variable declarations Functions and variable declarations If you declare a variable in a function, you can only use it in that function void setup() { int num = 5; int println(num); println(num); } void draw() { println(num); println(num); } 18 Functions and variable declarations Functions and variable declarations If you declare a variable in a function, you can only use it in that function void setup() { int num = 5; int println(num); //OK! println(num); } void draw() { println(num); println(num); } 19 Functions and variable declarations Functions and variable declarations If you declare a variable in a function, you can only use it in that function void setup() { int num = 5; int println(num); } void draw() { println(num); //Error! println(num); } 20 Functions and variable declarations Functions and variable declarations void setup() { int num = 5; int println(num); } void draw() { println(num); //Error! println(num); } 21 The basic scope rule* The basic scope rule* Scope is like a neighborhood, it's where the variable is known The basic scope rule* is the scope of variable begins with it's declaration and ends with the closing curly brace of the block of code where it was declared *there are exceptions to this rule, but we don't really care and we certainly aren't going to worry about it now 22 The scope of diameter is in yellow The scope of void draw() { ellipse(30,30,50,80); ellipse(30,30,50,80); noFill(); noFill(); strokeWeight(5); strokeWeight(5); int diameter = 100; int stroke(255,0,0); stroke(255,0,0); ellipse(60,60,diameter,diameter); ellipse(60,60,diameter,diameter); println(diameter); println(diameter); } 23 If you declare the variable at the top of If you the program outside of any function, it's scope is the entire program int diameter = 10; int 10; void setup() { println(diameter); //OK println( } void draw() { ellipse(30,30,50,80); ellipse(30,30,50,80); noFill(); noFill(); strokeWeight(5); strokeWeight(5); diameter = diameter + 10; //OK diameter stroke(255,0,0); stroke(255,0,0); ellipse(60,60,diameter,diameter); //OK ellipse(60,60, println(diameter); //OK println( } 24 Local vs. Global Local vs. Global A global variable can be used anywhere in the program You create a global variable by declaring it at the top of the program A local variable is declared in a function 25 The circle gets bigger The circle gets bigger int diameter = 10; void setup() { size(300,300); size(300,300); noFill(); noFill(); } void draw() { ellipse(150,150,diameter,diameter); ellipse(150,150,diameter,diameter); diameter = diameter + 10; diameter } 26 The circle DOESN'T get bigger The circle DOESN'T get bigger void setup() { size(300,300); size(300,300); noFill(); noFill(); } void draw() { int diameter = 10; int ellipse(150,150,diameter,diameter); ellipse(150,150,diameter,diameter); diameter = diameter + 10; diameter } 27 A Gradient A Gradient int redAmount = 0; int blueAmount = 255; int x = 0; void setup() { size(256,256); size(256,256); } void draw() { stroke(redAmount,0,blueAmount); stroke(redAmount,0,blueAmount); line(x,0,x,255); line(x,0,x,255); x=x+1; x=x+1; redAmount = redAmount + 1; redAmount blueAmount = blueAmount - 1; blueAmount } 28 A Circle that moves left to right A Circle that moves left to right int x = 0; void setup() { size(300,300); size(300,300); } void draw() { background(0); background(0); ellipse(x,150,30,30); ellipse(x,150,30,30); x = x + 1; 1; } 29 A Circle that moves back & forth A Circle that moves back & forth int x = 0; int change = 1; void setup() { size(300,300); size(300,300); } void draw() { background(0); background(0); ellipse(x,150,30,30); ellipse(x,150,30,30); x = x + change; change; } if(x > 300) if(x { change = -1; change } if(x < 0) if(x { change = 1; change } 30 Changing the amount of change Changing the amount of change The rate of change in the x and y direction is the slope. If the rate of change stays the same, the result is a straight line. Changing the amount of change produces a curve int x = 0; int y = 0; int xChange = 1; void setup() { size(300,300); size(300,300); } void draw() { ellipse(x,y,10,10); ellipse(x,y,10,10); x = x + xChange; xChange; y = y + 1; 1; if(x < 150) if(x { xChange = xChange + 1; xChange } else else { xChange = xChange - 1; xChange } } 31 Practice quiz question Practice quiz question Circle the output that best matches the following code int mystery = 0; void setup() { noFill(); noFill(); } void draw() { ellipse(50,mystery,20,20); ellipse(50,mystery,20,20); mystery = mystery + 15; mystery } 32 a b c d Input Input Most programs we see get input from people The most common ways people provide input are: Typing on the keyboard Moving and/or clicking the mouse 33 Input Input Processing makes input from the mouse and keyboard about as easy as it gets There are several predefined "system variables" mouseX mouseY key 34 Moving a circle with the mouse Moving a circle with the mouse void setup() { size(300,300); size(300,300); } void draw() { ellipse(mouseX,mouseY,30,30); ellipse(mouseX,mouseY,30,30); } The ellipse will track the mouse 35 Functions that respond to events Functions that respond to events keyTyped() keyPressed() keyReleased() mouseMoved() mousePressed() mouseReleased() mouseClicked() mouseDragged() 36 Painting only if mouse is dragged Painting only if mouse is void setup() { size(300,300); size(300,300); } void draw() { } void mouseDragged() void mouseDragged { ellipse(mouseX,mouseY,10,10); ellipse(mouseX,mouseY,10,10); } 37 More on if: Relational Operators More on < <= == >= > != if statements are created by comparing two if statements are created by comparing two things if(5 < 3) if(num == 5) if(num >= 5) if(num != 5) if the the comparison in the parenthesis is true, the code in the curly braces after the if executes. if executes. Otherwise it is skipped. 38 More on if: Relational Operators More on if (num1 < num2 < num3) Comparisons must be done two at a Comparisons must be done time 39 More on if: Relational Operators More on < <= == >= > != The operators that are used for comparisons are called relational operators 40 = vs. == A single equals (called the assignment operator) MAKES two things equal num = 3; num Don't put this in an if—it will always be true! The double equals asks a question: Are these two things equal? num==3 num==3 Use the double equals anywhere you would use a condition: if, etc. if(num==3) { println("num is three"); println("num } 41 Moving the ellipse with the keyboard Moving the ellipse with the keyboard int x, y; void setup() { size(300,300); size(300,300); x = 150; 150; y = 150; 150; } void draw() { ellipse(x,y,30,30); ellipse(x,y,30,30); } void keyPressed() { if(key == 'w') if(key { y = y - 5; 5; } } 42 More system variables: More system variables: pmouseX and pmouseY mouseX and mouseY hold the current mouseX and mouseY hold the position of the mouse pmouseX and pmouseY hold the previous pmouseX and pmouseY hold the position of the mouse 43 A drawing program A drawing program void setup() { size(300,300); size(300,300); } void draw() { stroke(0); stroke(0); fill(0,0,0,10); fill(0,0,0,10); rect(0,0,300,300); rect(0,0,300,300); } void mouseDragged() { stroke(255); stroke(255); line(mouseX,mouseY,pmouseX,pmouseY); line( } 44 Painting only if the Painting only if the right mouse button is clicked void setup() { size(300,300); size(300,300); } void draw() { } void mousePressed() { if(mouseButton==RIGHT) if(mouseButton==RIGHT { ellipse(mouseX,mouseY,10,10); ellipse(mouseX,mouseY,10,10); } } 45 boolean variables boolean booleans are the smallest, simplest kind of "mailbox" They can hold only one of two possible values: true or false Examples: boolean zoom = true; boolean true boolean cond = 3 >= 3; boolean >= boolean isBig = num > 7; boolean num 46 Painting only if the mouse is pressed Painting only if the and a key is pressed void setup() { size(300,300); size(300,300); } void draw() { } void keyPressed() void keyPressed() { if(mousePressed==true) if( { ellipse(mouseX,mouseY,10,10); ellipse(mouseX,mouseY,10,10); } } 47 Painting only if the mouse is pressed Painting only if the and a key is pressed a different way void setup() { size(300,300); size(300,300); } void draw() { } void mousePressed() void mousePressed() { if(keyPressed==true) if( { ellipse(mouseX,mouseY,10,10); ellipse(mouseX,mouseY,10,10); } } 48 Logical Operators Logical Operators && //AND || //OR ! //NOT Used to combine multiple conditions ("tests") Truth tables shown at right above Examples ( 0 < nCount ) && ( nCount <= 100 ) ( 0 < nCount ) || ( nCount <= 100 ) (‘A’ <= cGrade) && (cGrade <= ‘F’) ! (19 >= nAge && nAge >= 13) 19 < nAge || nAge < 13 49 Painting only if the mouse is dragged Painting only if the and the 'w' key is pressed void setup() { size(300,300); size(300,300); } void draw() { } void mouseDragged() { if(keyPressed == true && key == 'w') if( { ellipse(mouseX,mouseY,10,10); ellipse(mouseX,mouseY,10,10); } } 50 Practice Quiz Question: What is the output? Practice Quiz Question: What is the output? int num = 4; float dNum = 7.2; if((num > 5) && (dNum < 8)) { println("first"); println("first"); } if((num > 5) || (dNum < 8)) { println("second"); println("second"); } if(!(num > 5)) { println("third"); println("third"); } if(!(dNum < 8)) { println("fourth"); println("fourth"); } 51 Watch out for this error Watch out for this error int num = 5; if(num > 7); { println("num is big"); println("num } 52 There shouldn't be a semi­colon here There shouldn't be a semi­colon here int num = 5; if(num > 7); { println("num is big"); println("num } 53 There shouldn't be a semi­colon here There shouldn't be a semi­colon here int num = 5; if(num > 7); { println("num is big"); println("num } Is "If num is greater than 7." a complete sentence? 54 Now it's fixed Now it's fixed int num = 5; if(num > 7) { println("num is big"); println("num } No, the complete sentence is "If num is greater than 7 then num is big." 55 Symmetrical reflections (mirrors) Symmetrical reflections (mirrors) 56 Symmetrical reflections (mirrors) Symmetrical reflections (mirrors) 57 Symmetrical reflections (mirrors) Symmetrical reflections (mirrors) 58 Symmetrical reflections (mirrors) Symmetrical reflections (mirrors) 59 Symmetrical reflections (mirrors) Symmetrical reflections (mirrors) void setup() { size(300,300); size( } void draw() { ellipse(mouseX,mouseY,10,10); ellipse(mouseX,mouseY,10,10); ellipse(300-mouseX,mouseY,10,10); ellipse( } 60 int num = 5; if(num > 150) { num = 5; num } if and if/else and An if controls some code that either runs or doesn't if(num > 150) { num = 5; num } else { num = num + 10; num } An if/else always runs the code in the if or the 61 else, but never both "Chained" "Chained" if/else if(temp > 80) { println(Go swimming"); println(Go } else if(temp > 50) { println("Go Fishing"); println("Go } else if(temp > 32) { println("Go hot tubbing"); println("Go } else { println("Go sledding"); println("Go } 62 int num1= 2; int num2 = 7; float decimal = 9; if(num1 == 2) { println("First"); println("First"); } else if (num2 == 3) { println("Second"); println("Second"); } else if (decimal == 9) { println("Third"); println("Third"); } else { println("Fourth"); println("Fourth"); } Practice Quiz Question: What is the output of this Practice Quiz Question: What is the output of this program? if(num2/num1 != 1) { println("Fifth"); println("Fifth"); } if(num2/num1 != 3) { println("Sixth"); println("Sixth"); } else { println("Seventh"); println("Seventh"); } 63 ...
View Full Document

This note was uploaded on 01/13/2012 for the course CS 12 taught by Professor Ma during the Spring '08 term at UC Davis.

Ask a homework question - tutors are online