CSD Unit 3 Lesson 14 Conditionals Interactive Animations and Games '22 '23 Code org (2024)

Introduction

Walk through of Code.org CSD Unit 3 Lesson 14

Content

Good morning, coding, friends hope you're having a great day we're going to do a little tips and tricks on lesson.

14 conditionals, so conditionals is where we actually start to get to create things and start to make things happen in our coding Journey here with code.org.

So let's go ahead and jump in and get started, we're starting with booleans.

This is kind of the kind of the base of where we start with conditionals.

This is what it all boils down.

To is what I should stay should say: I saw a Boolean expression is an expression that can only evaluate to either true or false.

So it says, read the code below okay, there's some new symbols.

So let's go ahead and look at that and then you have true false true zero, two hundred one hundred true air, true false true- and that is all of them all right.

So we can see that we created variable here: Sprite, 1 and Sprite, two Sprite one was created, 100, 200 and Sprite 2 was created at 300 200.

and then it says, predict what each command will print.

Well, that would print down in the console log here.

Okay.

So if we look at this console log Sprite one well, here's my Sprite one dot y well, here's my y is equal to.

We got the double equal signs.

That means equal to Sprite, 2 dot y.

Well, if I look at Sprite, 2 and Sprite, one I can see they're both 200., so that would become true.

So we would see the word true pop up next one Sprite 1.x Sprite 1.x.

That is our greater than sign, so Sprite one is greater than Sprite 2.

Is that true? No that's false, so that would be false.

So we got a true and we got a false I'll.

Let you do the last one: okay and we can see that's a less than sign, so you go ahead and guess, what's going to happen, moving on I definitely encourage you to watch the videos.

These videos are really well done so, while you're watching it answer these questions, what is a bullying expression? What's an expression that would evaluate to true and what's an expression that would evaluate to false.

So as you watch that go ahead and answer those questions all right now we're going to do a little bit of matching here, okay, so what we're going to do is we're going to drag and place these where they belong, so we're just going to read the statement and see which of these matches.

So this is in words, and this is kind of uh- an expression right.

So is the dog's Sprite rotation less than the cat's Sprite rotation.

So if I read this, this is dog.x is less than cat dot, X, well, that that doesn't have to do with rotation.

So if I come over here, I see dog, dot, rotation, dog's rotation less than less than cats rotation.

Ah, that would go just like that.

Then I'd go and do the next one is the dog Sprite X less than the cat Sprite X? Oh, that was the one I did before dogs X less than so I drop that there and then we have is the dog's Sprite scale grater now I'm looking for a Sprite scale and greater sign than the cat scale, so I'll? Let you go ahead and keep dragging those into place.

You guys got this a bunch of rock stars out there all right this one's just telling us we're going to use this for several things.

So I'm going to hit run, we can see the car driving and you see the word faults down here when it crosses the Finish Line.

It becomes true nice all right, I'm going to version history, so we can do this together, start over taking forever.

Isn't it here we go.

Let's pull this down where I can read it.

Okay, the program draws a race car and a Finish Line.

We saw that we're going to figure out when the race car crosses the Finish Line.

The Sprites have all been set up for you.

So if we look down in here, I can see that my Finish Line and I can see my race car okay.

So we got those and they even have given us our draw Sprite.

So it says, add a console.log statement inside the draw Loop.

Well, here's my draw Loop and it says, add a console log, so I'm just going to take and drop it in.

It doesn't really matter where I'm just putting it right there for now.

Okay, now it says, add a Boolean expression inside the console log that asks is the exposition of the race car less than the X position of the finish line.

So let's just write out that expression so inside where it says message we're going to do math and it said less than now.

If you forget, I can always hover over these right and it'll.

Tell me less than or greater than so we got the less than inside the console log all right.

So now I've got the lesson.

What did it say? Instead is the X position of the race car, okay and I, grab that Sprite dot X in the first one, and that is race now notice they do a capital c on car okay.

So we got to get that Camel case in there.

So is the X position of the race car less than the X position of the finish line.

Race car.x I need Finish, Line, dot, X and if I look same thing, camelcase there we go I'm gonna hit, run and see what happens.

I see the word false.

It worked.

Let's just make sure we did everything they wanted.

Look at the output of the program as the car moves.

When does the output change and why? Oh, that's a good question: when did that change when this expression became true? Okay, it changed when this became true when our race cars about X was less than the finish line that changed all right.

Moving on to five remember, you can always hit that finish.

Button I, just click the levels up above for some reason all right.

So this is another little um prediction.

Okay, it says if statement bully Expressions allow us to ask questions, but in order to use these questions to change the program's Behavior, we need an if statement.

Okay, read the code for the race car program.

What will the program do when the car reaches the finish line? Why is it a statement inside the draw Loop? Oh, that's a good question, so here's this I can see the word winner.

What's going to pop up in the console log I'm going to let you do this, one I don't want to spoil it.

Then we have another video and this video is really good.

This tells us a lot more about conditionals, okay question.

You should be asking yourself as you watch it.

When would you want to use an if statement? Okay, moving on changing our fruit, we got this apple and when it gets so big, it's going to change into a pear watch this there.

It goes nice all right, we're gonna version history.

This we're gonna go down to start over all right.

It says now that you know how to use.

If statements you can do more than just check.

If the Apple has reached a scale of two, you turn it into a pair once it happens, and you guys watch that so use a conditional in the draw Loop to check whether fruit dot scale is greater than two.

If it is change the fruits animation.

So here we go.

We need to do an if, and it said if the fruit scale is greater than less than greater than nice.

I need to go to Sprite for fruit scale.

The name of our Sprite is fruit and they said greater than two, and if that happens, we just want to change this animation.

So it's not Sprite it's rude and it is going to look like a pear.

Let's try that there it goes it's growing.

Nice work guys moving on to eight all right.

It's got quite a few things.

The Boolean expression, this one's a lot of fun, but it's kind of makes you do a lot of thinking, honest one.

We're gonna hit run.

The big thing is down here and this comparison.

Okay, we got the first one.

True second, one is true, yours all say false okay, so we got to make everything evaluate to true.

It says you can modify the value of the Sprite properties so that each of the Boolean Expressions evaluates to true.

So here we go.

What we're doing is we're looking at the properties.

Remember our X Y.

Those are properties, rotation is a property and scale is a property.

So when we look at our code, the first one says now I've changed this, but it says Sprite 2.x is equal to Sprite 2 dot y.

Let's look at that now.

I've changed mine, so they're both 200., so those are equal now I, don't think that's how it was when I started but I'm going to let you go through and work on that the one I really want you to do is look at this alien celebration.

This one is a blast.

We got this little alien and when the spaceship gets so high, he starts dancing or in my thought, maybe he's running because they left him so kind of your choice on what you think is happening, but let's work this one together, all right.

So here we go.

If we look at it, it says make the alien dance.

When the spaceship reaches top of the screen run the program there.

He goes nothing happens, but if I look in the animations I got this animation called alien, dance, okay and then we just have alien standing our spaceship and our background.

So we're going to jump over here.

We always want to do this in the draw Loop, because that's what makes the motion happen right so we're in there and it says, add a conditional so we're going to add an if statement and we're checking to see if the spaceships y gets up so high okay.

So if I'm going up, you notice that that Y is getting smaller, so we want less than not greater than I see a lot of people grab the greater than for this one because we're just thinking.

Oh it's going in the sky, it's getting larger, but it really isn't in code.org as we go up, our numbers are getting smaller, so now, I'm going to grab Sprite dot Y and we're looking at the spaceship I'm just going to copy this over I just clicked in there hit Ctrl, C and then control V.

Now I want to pick a spot I'm going to say when it gets up to about two uh: that's when it gets up to about a hundred I want my animation of my little alien there's.

My alien I want him to change what he looks like and go to that alien dancing, I'm going to hit run the spaceship's going.

Ah there he goes and if I don't like that, I could change this to a 50, so it lets the spaceship get a little higher before he dances.

I, like that, looks good all right.

Here's the thing you're going to do the exact same thing on this one: I'm not going to do this one for you, but the dinosaur needs to turn into a Tyrannosaurus Rex.

Okay, so archranosaurus is going to turn into a pterodactyl.

So it's the same thing: we're changing our animation.

The exact same thing look at how we did on the last one and do it on this one.

You guys can do that now.

This final one, this is kind of cool.

This is where you learn how to make Sprites visible and invisible, and I will tell you.

This is the one place you learn how to do this and you're going to see this pop up quite a few more times.

So I would work this one so that you know how this works.

All right, I hope you guys had a wonderful day and happy coding.

CSD Unit 3 Lesson  14 Conditionals  Interactive Animations and Games '22 '23   Code org (2024)
Top Articles
Latest Posts
Article information

Author: Kimberely Baumbach CPA

Last Updated:

Views: 5427

Rating: 4 / 5 (61 voted)

Reviews: 84% of readers found this page helpful

Author information

Name: Kimberely Baumbach CPA

Birthday: 1996-01-14

Address: 8381 Boyce Course, Imeldachester, ND 74681

Phone: +3571286597580

Job: Product Banking Analyst

Hobby: Cosplaying, Inline skating, Amateur radio, Baton twirling, Mountaineering, Flying, Archery

Introduction: My name is Kimberely Baumbach CPA, I am a gorgeous, bright, charming, encouraging, zealous, lively, good person who loves writing and wants to share my knowledge and understanding with you.