360 likes | 490 Views
Lesson Two: Everything You Need to Know. Chapter 5: Conditionals Learning Processing Daniel Shiffman Presentation by Donald W. Smith Graphics from text. Lesson Two: Everything You Need to Know. 4: Variables 5: Conditionals Boolean Expressions Conditional Statements
E N D
Lesson Two: Everything You Need to Know Chapter 5: Conditionals Learning Processing Daniel Shiffman Presentation by Donald W. Smith Graphics from text
Lesson Two: Everything You Need to Know • 4: Variables • 5: Conditionals • Boolean Expressions • Conditional Statements • How a program produces different results based on varying circumstances • if, else if, else • Boolean variables • 6: Loops Learning Processing: Slides by Don Smith
Three categories of operators • Numerical (mathematical) operators: + - * / % Operates on numbers, the result is a number • Relational operators: > < >= <= == != Operates mainly on numbers, the result is a logical value: true/false • Logical operators: && || • &&: and • ||: or • Examples. Learning Processing: Slides by Don Smith
What is a Boolean Expression? AND • Something that resolves to either true or false (yes or no) • Not maybe… • Computers think in 1’s and 0’s • Remember truth tables • 1 = ON = True • 0 = OFF = False • Usually based on a comparison • Are you 21 years old? • Is changeCount less than 5? • Is myScore between 80 and 89? • Is lastName ‘Smith’? OR Learning Processing: Slides by Don Smith
Boolean Comparison Operators • Similar to Algebra • > greater than • < less than • >= greater than or equal to • <= less than or equal to • == eqality (equal to) • Note: ‘=‘ is the ‘assignment’ operator: x = 5; • != inequality (not equal to) Learning Processing: Slides by Don Smith
Boolean Expressions and if • What is a Boolean Expression? • A comparison that results in either a true or a false • Where do I use it? • Usually in parenthesis, after an if: • if (age >= 21) • // True Action • if (mouseX < width/2) • // True Action • Only do ‘Action’ if condition is • True Condition True False Action Learning Processing: Slides by Don Smith
Two-way conditionals: if else • Use elsefor ‘false’ actions after an if test: • ‘Binds’ with the closest if: • if (age >= 21) • // True Action • else // age < 21 • // False Action • Take one of the two paths: • True or False • Good idea to use curly braces: • if (age >= 21){ • // True Action • } else { • // False Action • } Condition True False False Action True Action Learning Processing: Slides by Don Smith
Examples and exercises • Find the larger number of two numbers. Two versions: using if or using if…else… • Moving rectangles with color changing. Three versions: Using if, using constrain, or using modulo. • Develop a program to simulate a stopping car. Learning Processing: Slides by Don Smith
Multiple Actions • What if I have more than one thing to do if true? • Make a ‘block’ of code after the if: • if (age >= 21) { • // True Action 1 • // True Action 2 • } else • // False Action • Indentation is for humans • if (age >= 21) • // True Action 1 • // True Action 2 • Without the curly braces: • Only the first statement after a conditional is executed • True Action 2 is executed no matter what age is! • And don’t forget to ‘match’ your curly braces! Condition True False False Action True Action 1 True Action 2 Learning Processing: Slides by Don Smith
Multiple-Way Branching: else if • What if you want more than two paths? • Use else if: • if (age >= 21) • // First True Action • else if (age > 18) • // Second True Action • else if (age > 5) • // Third True Action • Only one action done • Then go to the ‘bottom’ First Condition True First True Action False Second Condition True Second True Action False Third Condition True Third True Action False Learning Processing: Slides by Don Smith
else if with else at the end • Two ‘true’ paths and one ‘neither’ path? • Use else if: • if (age >= 21) • // First True Action • else if (age > 18) • // Second True Action • else • // Both False Action First Condition True First True Action False Second Condition True Second True Action False Both False Action Learning Processing: Slides by Don Smith
Example of Multi-way Branching • Where the mouse is determines the background color if (mouseX < width/3) { background(255); } else if (mouseX < 2*width/3) { background(127); } else { background(0); } Learning Processing: Slides by Don Smith
Multi-way Branching: Which to test first? Learning Processing: Slides by Don Smith
Gradebook Application • Determine the letter grade for a number 0-100 • 90 – 100: A • 80 – 89.999 B • 70 – 79.999 C • 60 – 69.999 D • Below 60: F • How would you plan/code a solution? • What would you test for first? • What second? • How many tests do you need? Learning Processing: Slides by Don Smith
Numeric Range testing • You often have to determine if a number is in a specific range (min to max) • Example: Which range is a number in? • 0-25: Print “Young” • 26-50: Print “Mid-Age” • >50: Print “Mature” • How would you plan/code a solution? • What would you test for first? • What second? • Can this be done with only two tests? Learning Processing: Slides by Don Smith
if else Examples float r = 150; // variables float g = 0; float b = 0; void setup() { size(200,200); } void draw() { background(r,g,b); stroke(255); // Line down center line(width/2, 0, width/2, height); if (mouseX > width/2) // If right r = r + 1; // more red else // Else left r = r - 1; // less red if (r > 255) // Range Check r r = 255; if (r < 0) // Range Check r r = 0; } else ‘binds’ with closest if You can useifwith no else clause! Learning Processing: Slides by Don Smith
Range check with constrain( ) float r = 150; // variables float g = 0; float b = 0; void setup() { size(200,200); } void draw() { background(r,g,b); stroke(255); // Line down center line(width/2, 0, width/2, height); if (mouseX > width/2) // If right r = r + 1; // more red else // Else left r = r - 1; // less red r = constrain(r,0,255); // Range Check r } Learning Processing: Slides by Don Smith
Three-way branching float r = 150; // variables float g = 0; float b = 0; void setup() { size(200,200); } void draw() { background(r,g,b); stroke(255); line(width * 2/3, 0, width * 2/3, height); line(width * 1/3, 0, width * 1/3, height); if (mouseX > (width * 2/3)) // right 3rd r = r + 1; else if (mouseX < (width * 1/3)) // left 3rd r = r -1; else // center 3rd ellipse(mouseX, mouseY, 30,30); r = constrain(r,0,255); // Range Check r } Learning Processing: Slides by Don Smith
Exercise 5-3: Move a rectangle… but stop! float x = 0; void setup() { size(200,200); } void draw() { background(255); fill(0); rect(x,100,20,20); x = x + 1; // Keep x in left half // Conditional version: // constrain version: } Learning Processing: Slides by Don Smith
Logical Operators: AND • Sometimes two (or more) things need to be true before you want to do something • Example: • If age >= 16 AND permit == 1 • Print “OK to drive” • How do we spell ‘AND’? && • ‘Nested ifs:’ One if, compound condition int age = 17; int permit = 1; if (age >= 16) if (permit == 1) print(“OK to Drive”); else print(“Ride the bus”); else print(“Ride the bus”); int age = 17; int permit= 1; if (age >= 16 && permit == 1) print(“OK to Drive”); else print(“Ride the bus”); Remember: else ‘binds’ with closest if (without an else) Learning Processing: Slides by Don Smith
Logical Operators: OR • Sometimes one of (two or more) things is enough to decide • Example: • If age >= 18 OR (age >= 16 AND permit == 1) • Print “OK to drive” • How do we spell ‘OR’? || (two vertical bars) int age = 17; int permit = 1; if (age >= 18 || (age >= 16 && permit == 1)) print(“OK to Drive”); else print(“Ride the bus”); Learning Processing: Slides by Don Smith
Logical Operators: OR • Sometimes one of (two or more) things is enough to decide • Example: • If age >= 18 OR (age >= 16 AND permit == 1) • Print “OK to drive” • How do we spell ‘OR’? || (two vertical bars) int age = 17; int permit = 1; if (age >= 18 || (age >= 16 && permit == 1)) print(“OK to Drive”); else print(“Ride the bus”); • Note the use of parenthesis to ‘connect’ the AND clause Learning Processing: Slides by Don Smith
Exercise 5-5: Simple Rollover int x = 50; int y = 50; int w = 100; int h = 75; void setup() { size(200,200); } void draw() { background(255); stroke(255); // test if mouse is over the rectangle if ( mouseX.. && mouseY.. && ??? // Change the color of the rectangle rect(x,y,w,h); } Learning Processing: Slides by Don Smith
Second half of Chapter 5 • 5.5: Multiple Rollovers • 5.6: Boolean Variables • 5.7: A bouncing ball • 5.8: Physics 101 Learning Processing: Slides by Don Smith
Multiple Rollover areas • Steps: • Draw a white background • Draw horizontal and vertical lines down the center • If mouse is in top left, draw black rectangle in that quadrant • If mouse is in top right, draw black rectangle in that quadrant • If mouse is in bottom left, draw black rectangle in that quadrant • If mouse is in bottom right, draw black rectangle in that quadrant • But how can we tell which quadrant it is in? • Upper Left: x = 0 to 99, y = 0 to 99 • Upper right: x = 100 to 199, y = 0 to 99 • … Learning Processing: Slides by Don Smith
boolean variables • You may want to ‘remember’ if something is true or false and store it in a variable • Then you can compare it to true or false • Example: • If age >= 16 AND permit == true • Print “OK to drive” int age = 17; boolean permit = true; if (age >= 16 && permit == true) print(“OK to Drive”); else print(“Ride the bus”); Learning Processing: Slides by Don Smith
Using a boolean variable for Buttons • A button is just a rollover area that senses mouse clicks. • Testing if (mouse is in the area of the object) AND mouse clicked can be quite a number of comparisons! boolean button = false; intulx = 50, uly = 50, w = 100, h = 75; // rect variables … if (mouseX > ulx && mouseY > uly && mouseX < ulx + w && mouseY < uly + h && mousePressed) button = true; else button = false; // Later in code if (button == true) print(“I’ve been clicked!”); Learning Processing: Slides by Don Smith
Using a boolean variable for Buttons • A button is just a rollover area that senses mouse clicks. • Testing if (mouse is in the area of the object) AND mouse clicked can be quite a number of comparisons! boolean button = false; intulx = 50, uly = 50, w = 100, h = 75; // rect variables … if (mouseX > ulx && mouseY > uly && mouseX < ulx + w && mouseY < uly + h && mousePressed) button = true; else button = false; // Later in code if (button == true) print(“I’ve been clicked!”); if(button) // Does the same thing as if (button == true) Learning Processing: Slides by Don Smith
Using a boolean variable for Buttons • A button is just a rollover area that senses mouse clicks. • Testing if (mouse is in the area of the object) AND mouse clicked can be quite a number of comparisons! boolean button = false; intulx = 50, uly = 50, w = 100, h = 75; // rect variables … if (mouseX > ulx && mouseY > uly && mouseX < ulx + w && mouseY < uly + h && mousePressed) button = true; else button = false; // Later in code if (button == true) print(“I’ve been clicked!”); if(button) // Does the same thing as if (button == true) • Do you like the way the tests are lined up on multiple lines? Learning Processing: Slides by Don Smith
Example 5.5: A Button as a switch • Test where the mouse is in the mousePressed() method. • Then set a boolean variable to true or false boolean button = false; intulx = 50, uly = 50, w = 100, h = 75; // rect variables … void draw() { if (button) // actions if button pressed } void mousePressed() { if (mouseX > ulx && mouseY > uly && mouseX < ulx + w && mouseY < uly + h) if (button) // alternate on every click button = false; else button = true; } Learning Processing: Slides by Don Smith
Example 5.5: A Button as a switch • Test where the mouse is in the mousePressed() method. • Then set a boolean variable to true or false boolean button = false; intulx = 50, uly = 50, w = 100, h = 75; // rect variables … void draw() { if (button) // actions if button pressed } void mousePressed() { if (mouseX > ulx && mouseY > uly && mouseX < ulx + w && mouseY < uly + h) if (button) // alternate on every click button = false; else button = true; } button = !button; // quite a bit shorter, eh? } Learning Processing: Slides by Don Smith
Exercise 5-8: Click to start a moving ‘ball’ // Declare a boolean, set to false int circleX = 0; int circleY = 100; void setup() { size(200,200); } void draw() { background(100); stroke(255); fill(0); ellipse(circleX, circleY, 50, 50); // Move the circle only after a click } void mousePressed() { // react to the mouse being pressed // Location of the mouse doesn’t matter } • Use a boolean variable to represent if we are moving or not. • Change the variable each time the mouse pressed. Learning Processing: Slides by Don Smith
Example 5-6: A bouncing ‘ball’ int circleX = 0; int speed = 1; void setup() { size(200,200); smooth(); } void draw() { background(255); circleX = circleX + speed; if ( circleX > width || circleX < 0) speed = speed * -1; // reverse course // Display the circle at x location stroke(0); fill(175); ellipse(circleX, 100, 32, 32); } • Use a variable speed which can be positive or negative. • Change speed to negative if we bounce off the right edge. // What will this do? void mousePressed() { speed = speed + 1; } Learning Processing: Slides by Don Smith
A note about debugging… int circleX = 0; int speed = 1; void setup() { size(200,200); smooth(); } void draw() { background(255); circleX = circleX + speed; if ( circleX > width || circleX < 0) speed = speed * -1; // reverse course // Display the circle at x location stroke(0); fill(175); ellipse(circleX, 100, 32, 32); } • You can print the variable speed to see what it is doing. • Use println(speed) if you want one number per line. void mousePressed() { speed = speed + 1; println(speed); } Learning Processing: Slides by Don Smith
Summary • Conditionals allow you to control the flow • if, else, else if allow many options • Boolean expressions are used inside if(… ) tests • Resolve to either true or false • Boolean expressions use comparison operators: • >, <, >=, <=, ==, != • Boolean variables can be set to true or false, and also used in conditional expressions • AND and OR (&& and ||) are used to combine conditionals • You can use print() and println()to help debug your programs while you are testing them Learning Processing: Slides by Don Smith