Lesson 2 – Everything You Need to Know

  Chapters of This Lesson

  Chapter 4 : Chapter 4 : Chapters of This Lesson

  Chapters of Variables 1.

  In this chapter : Variables: What are they?

  4.1 What is a Variable?

   manner. On any given day, Might say “A The concept of a variable in an intuitive

  4.1 What is a Variable?

   call it memory? The computer has memory. Why do we

  4.1 What is a Variable?

   one instruction at time, a variable allows a Since computers only process information

  4.1 What is a Variable?

   sheet of graph paper and each cell on the Imagine that the computer’s memory is a

  4.1 What is a Variable?

  4.2 Variable Declaration and Initialization

   references to object and array. Variables can hold primitive values or

  4.2 Variable Declaration and Initialization

   spaces) and must start with a letter Variables names must be one word (no

  4.2 Variable Declaration and Initialization

   commonly use: Here are data types you will

  4.2 Variable Declaration and Initialization

   Example :

  4.2 Variable Declaration and Initialization

   Don’t Forget

  4.2 Variable Declaration and Initialization

   All Primitive Types

  4.2 Variable Declaration and Initialization

   Once a variable is declared, we can

  4.2 Variable Declaration and Initialization

   We can combine the previous slide

  4.2 Variable Declaration and Initialization

   What’s in a name?

  4.2 Variable Declaration and Initialization

  4.2 Variable Declaration and Initialization 

  A variable can also be initialized by another variable (x equals y) or by

  4.2 Variable Declaration and Initialization 

  If, we running this program, the program will not show us the result.

  4.2 Variable Declaration and Initialization 

  Result :

  4.2 Variable Declaration and Initialization 

  The Prosram :

   Though it may initially seem more complicated to have words standing in

  

  Example :

  

  We have learned how to take this

  simple example one step further,

  

  Example 4-2: Usins Variables

  

  Result of Example 4-2: Usins Variables

   Variables introduce assignment operations to the mix.

   Examples of assigning a new value to a variables

   In the above code, circleX starts with a value of 100.

  

  Example 4-3: Varyins variables

  

  Result of Example 4-3: Varyins variables

  

  The principles of prosrammins motion

  

  Exercise 4-3 : Chanse Example 4-3 so that instead of the circle movins

  

  Exercise 4-3 : Chanse Example 4-3 so that instead of the circle movins

  

  Exercise 4-3:

  

  Answer of Exercise 4-3:

  

  Answer of Exercise 4-3:

   Let’s take the example one step further and use variables for every piece of

  

  Example 4-4: Many variables

  

  Example 4-4: Many variables

  

  Example 4-4: Many variables

  

  Output of Example 4-4: Many variables

   Exercise 4-4 :

  

  Exercise 4-4 :

   As we saw with mouseX and mouseY, Processing has a set of convenient

  

  Output of Example 4-5: Usins system variables

  

  Example 4-5: Usins system variables

  

  Exercise 4-5: Usins width and heisht, recreate the followins

  

  Output of Exercise 4-5

  

  

Example 4-6: Ellipse with variables

  

  

Example 4-6: Ellipse with variables

  

  Output of Example 4-6: Ellipse with variables

  

  Example of Random () function

  

  Example of Random () function

  

  Example 4-7 shows what happens if we

  take every variable associated with

  

  Example 4-7

  

  Example 4-7

  

  Example 4-7

   We are now ready to revisit Zoog, our alien friend.

   Feature #1 is solved by simply taking the previous program that used mouseX and

  

  Output of Example 4-8: Variable Zoos

  

  Example 4-8: Variable Zoos

  

  Example 4-8: Variable Zoos

  

  Example 4-8: Variable Zoos

  

  Example 4-8: Variable Zoos Chapters of This Lesson

  Conditionals Conditionals 1. In this Chapter Boolean expressions

  5.1 Boolean Expressions

  5.1 Boolean Expressions

   only take one kind of test: a boolean test true- In the world of computer programming, we

  5.1 Boolean Expressions

  5.1 Boolean Expressions

  5.1 Boolean Expressions

  5.1 Boolean Expressions

   variable in a boolean expression, allowing In this chapter, we will learn how to use a

  5.1 Boolean Expressions

  5.1 Boolean Expressions

   boolean expression. The following operators can be used in a

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If In Processing, we might have something

  more like:

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Or, more formally, with the output shown in Below.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Or, more formally, with the script shown in Below.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Or, more formally, with the script shown in Below.

  5.2 Conditionals: If, Else, Else If

  5.2 Conditionals: If, Else, Else If

  The boolean expression and resulting instruction in the previous slide sour code

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If The structure can be expanded with keyword else.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If For Example, we could say the following, with the output shown in Figure 5.2 below.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If For Example, we could say the following, with the output shown in Figure 5.2 below.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Script in Figure 5.2 below.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Script in Figure 5.2 below.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Finally, for testing multiple conditions, we can employ an “else if”.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Finally, for testing multiple conditions, we can employ an “else if”.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Figure 5.3

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Explanation of Figure 5.3

  5.2 Conditionals: If, Else, Else If

  5.2 Conditionals: If, Else, Else If Taking our simple mouse example a step

  further, we could say the following, with

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If The results shown in Figure 5.4.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Script in Figure 5.4.

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Exercise 5-1: Consider a grading system

  where number are turned into letters. Fill

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Exercise 5-1:

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Exercise 5-1:

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Exercise 5-1:

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Exercise 5-1:

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If

  Exercise 5-2: Examine the following

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Problem #1 : Determine if a number

  is between 0 and 25, 26 and 50, or

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If Problem #2 : if a number is 5, chanse

  it to 6. If a number is 6, chanse it to

  5.2 Conditionals: If, Else,

  5.2 Conditionals: If, Else, Else If Else If What is the diferences between two

  thinss in below

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch tasks based on the result of certain conditions. This is a very example of a program that performs diferent

  Our pseudocode is below

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Example 5-1 : Conditionals

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Example 5-1 : Conditionals

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Example 5-1 : Conditionals

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   solution to the constrain problem, Processing While using if statements is a perfectly valid

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   we intend to constrain, the minimum limit, and Constrain() takes three arguments: the value

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   variable. Note the use of constrain() for all three

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Example 5-2: More Conditionals

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Example 5-2: More Conditionals

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Example 5-2: More Conditionals

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Example 5-2: More Conditionals

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Example 5-2: More Conditionals

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Example 5-2: More Conditionals

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Exercise 5-3: Move a rectangle

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Exercise 5-3:

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Exercise 5-3:

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Exercise 5-3: (if statement)

  5.3 Conditionals in a Sketch

  5.3 Conditionals in a Sketch

   Exercise 5-3: (constraint

  5.4 Logical Operators

  5.4 Logical Operators

   We will commonly want to do the same thing in programming from time

  5.4 Logical Operators

  5.4 Logical Operators

   Our frst instinc mught be to write

  5.4 Logical Operators

  5.4 Logical Operators

   Code using a nested if statement,

  5.4 Logical Operators

  5.4 Logical Operators

   Code using a nested if statement,

  5.4 Logical Operators

  5.4 Logical Operators

   In other words, we would have to bypass two if statements before we can reach the

  5.4 Logical Operators

  5.4 Logical Operators

  5.4 Logical Operators

  5.4 Logical Operators

  

  5.4 Logical Operators

  5.4 Logical Operators 

  The logical operator “not” (exclamation point)

  5.4 Logical Operators

  5.4 Logical Operators 

  The logical operator “not” (exclamation point)

  5.4 Logical Operators

  5.4 Logical Operators 

  The logical operator “not” (exclamation point)

  5.4 Logical Operators

  5.4 Logical Operators 

  Exercise 5-4: Are the following boolean expression true or false ?

  5.4 Logical Operators

  5.4 Logical Operators 

  Exercise 5-5: Write a program that

  implements a simple rollover. In other

  5.4 Logical Operators

  5.4 Logical Operators 

  Code

  5.5 Multiple Rollovers

  5.5 Multiple Rollovers 

  Let’s solve a simple problem together, a slightly more advanced version of

  5.5 Multiple Rollovers

  5.5 Multiple Rollovers 

  Let’s frst write the logic of our program in pseudocode (i.e., English).

  5.5 Multiple Rollovers

  5.5 Multiple Rollovers

   Draw: 1. Draw a white backsround.

  5.5 Multiple Rollovers

  5.5 Multiple Rollovers 

  Script Example 5-3:

  5.5 Multiple Rollovers

  5.5 Multiple Rollovers 

  Script Example 5-3:

  5.6 Boolean Variables

  5.6 Boolean Variables

   The natural next step up from programming a rollover is a button.

  5.6 Boolean Variables

  5.6 Boolean Variables 

  Button example will include one boolean variable with a starting value of false

  5.6 Boolean Variables

  5.6 Boolean Variables 

  In the case of a rollover, any time the mouse hovered the rectangle, it turned

  5.6 Boolean Variables

  5.6 Boolean Variables 

  We can check to see if the mouse location is inside the rectangle and if the

  5.6 Boolean Variables

  5.6 Boolean Variables

   Output Example 5-4: Hold down the button

  5.6 Boolean Variables

  5.6 Boolean Variables

   Example 5-4: Hold down the button

  5.6 Boolean Variables

  5.6 Boolean Variables

   Example 5-4: Hold down the button

  5.6 Boolean Variables

  5.6 Boolean Variables

   Example 5-4: Hold down the button

  5.6 Boolean Variables

  5.6 Boolean Variables

   We now need to write some code that “tossles” the switch, chanses its state

  5.6 Boolean Variables

  5.6 Boolean Variables 

  See this code:

  5.6 Boolean Variables

  5.6 Boolean Variables 

  Output Example 5-5: Button as switch

  5.6 Boolean Variables

  5.6 Boolean Variables 

  Script Example 5-5: Button as switch

  5.6 Boolean Variables

  5.6 Boolean Variables 

  Script Example 5-5: Button as switch

  5.6 Boolean Variables

  5.6 Boolean Variables 

  Script Example 5-5: Button as switch

  5.6 Boolean Variables

  5.6 Boolean Variables 

  Exercise 5-7: Why doesn’t the followins code work properly when

  5.6 Boolean Variables

  5.6 Boolean Variables 

  Exercise 5-8: Example 4-3 in the previous chapter moved a circle

  5.6 Boolean Variables

  5.6 Boolean Variables 

  Exercise 5-8:

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  

Reversins the Polarity of a Number

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Reversins the Polarity of a Number

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Running the sketch, we now have a circle turns around when it reaches the right-

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  If the ball goes of their the right or left edge, turn the ball around.

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Example 5-6 : Bouncins ball

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Example 5-6 : Bouncins ball

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Example 5-6 : Bouncins ball

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Furtheremore, consider a rectangle that follows the edges of a window.

  5.7 Bouncing Ball

  5.7 Bouncing Ball  State #0: left to right.

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Example 5-8: Square followins edse, uses a “state” variable

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Example 5-8: Square followins edse, uses a “state” variable

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Example 5-8: Square followins edse, uses a “state” variable

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Example 5-8: Square followins edse, uses a “state” variable

  5.7 Bouncing Ball

  5.7 Bouncing Ball 

  Example 5-8: Square followins edse, uses a “state” variable

  5.8 Physics 101

  5.8 Physics 101

   masses. Gravity is a force of attraction between all

  5.8 Physics 101

  5.8 Physics 101

   Acceleration increases (or decreases) speed.

  5.8 Physics 101

  5.8 Physics 101 

  Example 5-9: Simple Gravity

  5.8 Physics 101

  5.8 Physics 101 

  Example 5-9: Simple Gravity

  5.8 Physics 101

  5.8 Physics 101 

  Example 5-9: Simple Gravity

  5.8 Physics 101

  5.8 Physics 101 

  Example 5-9: Simple Gravity

  5.8 Physics 101

  5.8 Physics 101 

  How a simple version with Zoos in Physics?

  5.8 Physics 101

  5.8 Physics 101 

  Example 5-10: Zoos and conditionals

  5.8 Physics 101

  5.8 Physics 101 

  Example 5-10: Zoos and conditionals

  5.8 Physics 101

  5.8 Physics 101 

  Example 5-10: Zoos and conditionals

  5.8 Physics 101

  5.8 Physics 101 

  Example 5-10: Zoos and conditionals

  Subjects 

  In this chapter: The concept of iteration

  6.1 What is iteration? 

  Iteration is the generative process of

  repeating a set of rules or steps over and

  6.1 What is iteration? 

  Example 6-1: If we want to many line in Processing.

  6.1 What is iteration? 

  Example 6-1: Many Lines

  6.1 What is iteration? 

  Example 6-1: Many Lines

  6.1 What is iteration? 

  In the example 6-1, line are drawn from

  x = 50 pixels all the way to x 150 pixels,

  6.1 What is iteration? 

  First, we set up variables for each parameter of our system: the line ’ x , y

  6.1 What is iteration? 

  Example 6-2: Many Lines with variables

  6.1 What is iteration? 

  Example 6-2: Many Lines with variables

  6.1 What is iteration? 

  Example 6-2: Many Lines with variables

  6.2 WHILE Loop

  6.2 WHILE Loop

   loop, the do-while loop, and the for loop. There are three types of loops, the while

  6.2 WHILE Loop

  6.2 WHILE Loop

   condition. A while loop employs a boolean test

  6.2 WHILE Loop

  6.2 WHILE Loop 

  A while loop structure

  6.2 WHILE Loop

  6.2 WHILE Loop  Let’s take the code from lines problem.

  6.2 WHILE Loop

  6.2 WHILE Loop 

  Example 6-3: While Loop

  6.2 WHILE Loop

  6.2 WHILE Loop 

  Output of Example 6-3: While Loop

  6.2 WHILE Loop

  6.2 WHILE Loop

   Instead of writing “ line(x,y,x,y+ len); ” many times as we did at frst, we now

  6.2 WHILE Loop

  6.2 WHILE Loop 

Figure 6.4 : 

  6.2 WHILE Loop

  6.2 WHILE Loop 

  Let’s look at one more example, this time using rectangles instead of lines, as

  6.2 WHILE Loop

  6.2 WHILE Loop 1.

  What is the initial condition for your loop? Here, since the frst rectangle is

  6.2 WHILE Loop

  6.2 WHILE Loop

  

2. When should your loop stop? Since we want

to display rectangles all the way to the

  6.2 WHILE Loop

  6.2 WHILE Loop 

  case, each time through the loop, we

  6.2 WHILE Loop

  6.2 WHILE Loop 

  The code will be

  6.2 WHILE Loop

  6.2 WHILE Loop 

  Exercise 6-1 : Fill in the blanks in the code to recreate the followins

  6.2 WHILE Loop

  6.2 WHILE Loop 

  Exercise 6-1 : Fill in the blanks in the code to recreate the followins

  6.3 EXIT Conditions

  6.3 EXIT Conditions 

  Loops, as you are probably starting to realize, are quite handy.

  6.3 EXIT Conditions

  6.3 EXIT Conditions  Figure 6.6 .

  6.3 EXIT Conditions

  6.3 EXIT Conditions  Figure 6.6 .

  6.3 EXIT Conditions

  6.3 EXIT Conditions

   Examining the “lines” in Example 6-3, we can see that as soon as x is greater than

  6.3 EXIT Conditions

  6.3 EXIT Conditions 

  Processing will not give you an error should your exit condition never occur.

  6.3 EXIT Conditions

  6.3 EXIT Conditions  Output : .

  6.3 EXIT Conditions

  6.3 EXIT Conditions 

  Recalling the constrain() function

  described in Chapter 4, we can

  6.3 EXIT Conditions

  6.3 EXIT Conditions 

  Example 6-5:

  6.3 EXIT Conditions

  6.3 EXIT Conditions 

  Example 6-5:

  6.3 EXIT Conditions

  6.3 EXIT Conditions 

  Output : Example 6-5: (with the mouse)

  6.4 FOR Loop

  6.4 FOR Loop 

  A certain style of while loop where one

  value is incremented repeatedly

  6.4 FOR Loop

  6.4 FOR Loop 

  Write in For :

  6.4 FOR Loop

  6.4 FOR Loop

   Initialization —Here, a variable is declared and initialized for use within the

  6.4 FOR Loop

  6.4 FOR Loop 

  Iteration Expression —The last

  element is an instruction that you want

  6.4 FOR Loop

  6.4 FOR Loop 

  Figure 6.7

  6.4 FOR Loop

  6.4 FOR Loop 

  Note :

  6.4 FOR Loop

  6.4 FOR Loop 

  The same exact loop can be programmed with the while format.

  6.4 FOR Loop

  6.4 FOR Loop 

  Rewriting the lines drawing code to use a

  for statement looks like this:

  6.4 FOR Loop

  6.4 FOR Loop 

  Examples 6-6: Lines with a for loop

  6.4 FOR Loop

  6.4 FOR Loop 

  Examples 6-6: Lines with a for loop

  6.4 FOR Loop

  6.4 FOR Loop 

  Exercise 6-2: Rewrite Exercise 6-1 using for a loop.

  6.4 FOR Loop

  6.4 FOR Loop 

  Exercise 6-2: Rewrite Exercise 6-1 using for a loop.

  6.4 FOR Loop

  6.4 FOR Loop 

  Exercise 6-3: Following are some

  additional examples of loops. Match the

  6.4 FOR Loop

  6.4 FOR Loop 

  Exercise 6-3:

  6.4 FOR Loop

  6.4 FOR Loop 

  Exercise 6-3:

  6.4 FOR Loop

  6.4 FOR Loop 

  Exercise 6-3:

  6.4 FOR Loop

  6.4 FOR Loop 

  Exercise 6-3:

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Consider the following loop (which happens to be the answer to Exercise 6-

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Let’s say we want to take the above loop and display each line one at a time so

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Example :

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Example :

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Displaying the lines one at a time is something we can do with a global

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Example 6-8: Lines one at a time

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Example 6-8: Lines one at a time

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Example 6-9: Simple while loop with interactivity

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Example 6-9: Simple while loop with interactivity

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Example 6-9: Simple while loop with interactivity

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Example 6-9: Simple while loop with interactivity

  6.5 Loop Inside the Main

  6.5 Loop Inside the Main Loop Loop

  Exercise 6-8: Create a grid of squares (each colored randomly) using a for The End and Thank You

  

  Shifman, Daniel. 2008. Learning Processing : A Beginners Guide to