Introduction to Object-Oriented Programming Scratch the Cat

Object Oriented Programming Writing computer programs Based on Objects Instead of Actions Based on Data Instead of Logic

Traditional Programming Input Data Process the Data using Logic Output the Data Example: Add 2 Numbers Get Number 1 Get Number 2 Process the Data Add Number 1 + Number 2 The Answer is: _______

Object Oriented Programming Focus is on the Object we want to Manipulate/Change Person Animal – (Scratch the Cat) Building Buttons / Icons Identify What Objects You Need How do the Objects Relate to Each Other

Objects All Objects have 3 Parts Properties Methods Events What the Object looks like Methods Things the Objects can do Events What activities (by the user or by the computer) that the object responds to

Our Programming Example Dog vs. Cat The cat and dog will walk up to one another and say hi (bark and meow) Object Oriented Programming What objects will we need? (Objects and Properties) What do the objects need to do? (Methods) When do they need to do these things? (Events)

Let’s Get Programming Start Scratch the Cat Double Click on the Scratch Icon

Scratch Interface Properties Methods and Events Display Code Objects

Objects What Objects do You Need? Cat – Already Exists (Scratch) Cat Dog Cat – Already Exists (Scratch) Set Properties for Scratch

Properties – Edit Cat Properties 2) Click Costumes 3) Edit Costume1 1) Click on Scratch

Smaller Rotate Flip Bigger Tools Colors

2) Use Mouse to Erase Scratch Edit Cat Properties Change the Animal Erase the Current Cat 2) Use Mouse to Erase Scratch 1) Click Eraser

Edit Cat Properties 1) Import 2) Click Animal Folder 3) OK

Pick New Animal Scroll 1) Pick a Cat 2) OK

Edit Properties Change the Size Make Smaller ?????

Add Sound Properties Sounds

Add Sound Scratch already has One Sound Add Another Sound MEOW Import Animal  Cat  OK 2) Animal 3) Cat

Add A 2nd Object - DOG Add New Sprite (Object) Add New Sprite

Add a 2nd Object - Dog Look Familiar – What Should We Do??

Edit the Object Properties Resize – Make Smaller Rotate if Needed So Dog will Face the Cat

Add Sound New Objects will not have any existing sounds Add a Sound 1) Import New Objects will not have any existing sounds Add a Sound Import Animal  Dog1  OK 2) Animal 3) Dog1

Add Events Events are the Actions Each Object will Respond to Can be Computer Generated or User Generated Cannot Respond to EVERY action 1st Event in this Program Starting the Program When the User Clicks the Green Flag

Events Responses to Actions 1st Event – Starting the Program 2) Make sure Scripts is Clicked Responses to Actions Can be Computer Generated or User Generated We need to tell the Objects (Cat and Dog) what Actions to Respond to They cannot respond to everything 1st Event – Starting the Program When the Green Flag is Clicked 1) Make sure CAT is Clicked Move Objects around using Mouse to look like this.

Event – When Flag Clicked 1) Control Flag Event is in the Control Section Using Mouse – Drag to the Script area 2) Drag Flag to Scripts Area

Methods – When Flag Clicked What do we want the Cat to do when the Flag is Clicked Say Meow Make a Meowing Sound These are Methods Add Method to Code Window (Attach to Event)

2) Drag “Say “Hello” to Code Method – Say Meow Find Method LOOKS section Drag “Say HELLO for 2 Secs” to Scripts area We don’t want Cat to Say “Hello” Boxes in Methods are things we can change 1) LOOKS 2) Drag “Say “Hello” to Code

Method – Say Meow Click on “Hello” box Click on “2” box Type “MEOW” Click on “2” box Type “1” Test – Click the Green Flag (Code a Little – Test a LOT)

Add Next Method – Play Sound Add Sound SOUND Section Drag “Play Sound Cat” to Scripts Area Change “Cat” to “Meow” Test 1) Sound 2) Drag to Event

Variables A variable is a placeholder for a number that we don’t know what it is yet, or a number that can change It has a name We assign it a value when we are ready We can change the value when we need to Let’s include a variable to count how many times the cat meows

Make a Variable - Counter Click the “VARIABLE” section Click on the “Make a Variable” option Give the Variable a Name: COUNTER Make sure “For all Sprites” is clicked OK 1) Variables 2) Make a Variable 3) Give a Name

Variable Shows Up Variable Choices

Give Variable a Value We need to set a Value for our Counter Variable When all variables are created in Scratch they are given a value of Zero We need to set it to zero so that it resets every time we start over and hit the green flag

Give Variable a Value Drag “Set Counter to 0” method over to the Scripts Area Put just under Drag to Code List

Update Value We want to change the value of the counter every time the cat meows What options do we have to do that??

Update Value Drag “Change Counter by 1” method over to the Scripts Area Underneath other instructions

Repeating Actions How many times to we want the cat to meow? As long as we run the program? We do not want to have to add more instructions for each time Programmers use something called a LOOP to repeat Let’s have our cat meow 15 times

Adding a Loop Click on “CONTROL” section Find the Loop instructions Drag the instructions to Scripts Area Need to put above the cat meowing to repeat this action 2) Put Here 1) Repeat

Adding a Loop Change the “10” value to “15” to loop 15 times Test It Watch Counter We could use the “Forever” loop to loop as long as the program is running Change to 15

Events - Let the Dog Respond The dog has to know that the cat has meowed Cat has to cause a computer generated event Dog can respond by barking Broadcast an Event And wait for a response

1) Drag Broadcast and Wait Create an Event Drag “Broadcast” to the Scripts Area Click on the Down Arrow “NEW” Name the Event “CatMeow” 1) Drag Broadcast and Wait 2) Arrow - NEW

Have Dog Respond Click on the Dog Sprite No Scripts yet for the Dog Object

Have Dog Respond Dog must “listen” for the CatMeow event Drag “When I receive CatMeow” to the Scripts Area When the Cat Meow and the event “fires” the Dog will hear it What should the dog do??? Bark

Dog Bark “LOOKS” Section Drag “Say Hello for 2 Secs” to Scripts Area Change “Hello” to “Woof” Change 2 secs to 1 sec Test It 1) Drag to Scripts Area 2) Change to Woof and 1 Sec

Dog Bark “SOUND” Section Drag “Play Sound” to Scripts Area Click on Down Arrow Select “Dog1” sound Test It 1) Play Sound 2) Dog1 Sound

Dog Chases Cat Dog moves toward the Cat Cat moves away from the Cat Move 20 steps Cat moves away from the Cat Move 10 steps Add Code for Each Object to Move

Dog Chases Cat Make sure the Dog Object is Selected “MOTION” Section “Move 10 Steps” Change to 20 Steps 1) Dog 2) Move 10 Steps 3) Change to 20

Cat Runs from Dog Click Cat Object Motion Test It “Move 10 Steps” Put Under “Broadcast” Test It 1) Pick Cat 2) Move 10 Steps 3) Put into Scripts

Clear Method Return the Objects to their Starting Place to Run Again Responds to an Event Move Dog to Location (-125, -30) Move Cat to Starting Location (135, -15) Uses Pixel numbers – (0,0) is the middle of the screen

Clear Method 2) CONTROL 1) Cat 3) When I Receive Event

Create the Event Drag to the Scripts Area Click on the “CatMeow” Box NOT part of other instructions Click on the “CatMeow” Box Click “NEW” to create a new Event Name Event “CLEAR”

Move the Cat Locations use an X and Y values for Height and Width “MOTION” Section Set X to 0 Set Y to 0 Change X to 135 Change Y to -15 1) Set X to 0 2) Set Y to 0 3) Change Values

Broadcast the Clear Event Make the Clear Event Happen Beginning of Program 1) CONTROL 2) Broadcast “CatMeow”

Broadcast the Clear Event CONTROL Section Drag to Top – Right below Click on “CatMeow” Change to “Clear” Event 1) Below Flag Click

3) When I Receive “CatMeow” Move the Dog Uses the Same Event Still Need to “listen” for it (Already being Broadcast) 2) CONTROL 1) Click Dog Object 3) When I Receive “CatMeow”

Move the Dog CONTOL Section Drag to the Scripts Area Not part of other instructions Click on the “CatMeow” Box Click “Clear” event

Move the Dog “MOTION” Section Set X to 0 Set Y to 0 Change X to -125 Change Y to -30 1) Set X to 0 2) Set Y to 0 3) Change Values