Coding Lesson 1-7

Coding Lesson 1-7

Review

Creating Shapes

• rectangle: rect(x, y, w, h)

• ellipse: ellipse(x, y, w, h)

• x=distance to the right of the origin

• y=distance down from the origin

• w=width of the shape

• h=height of the shape

Fill in the Blanks

How do you code a rectangle in Javascript?

Fill in the Blanks

How do you code an ellipse in Javascript?

How to Create Other Shapes...

• Polygons can be created by using multiple sets of coordinates.

• For a triangle, it would look like this: (x1, y1, x2, y2, x3, y3) where each set represents a point on the coordinate grid.

Fill in the Blanks

What do the characters in parentheses mean when coding a polygon like this: shape(x1, y1, x2, y2, x3, y3)

Variables

• You must create a variable to use it.

• For example, to create the variable "school", we would first create it like this: var school

• Then we need to give it a starting value. So we could add the two together into one step like this: var school = 100

• Variables save storage space in our programs.

Multiple Choice

What is the correct way to create a variable and declare its starting value?

• var sandcreek = 10

• var sandCreek = 10

• var SandCreek = 10

• var Sandcreek = 10

Random Numbers

• Another way to add to a program is to create a random number.

• To do this, you need to create this code: randomNumber (min, max)

• The min is the minimum number that you want to be included.

• The max is the maximum number that you want to be included.

Multiple Choice

What do min and max mean in randomNumber(min, max)?

• min means mini and max means maxi

• min means minimum and max means maximum

• min means minimum and max means max

• min means min and max means maximum

Thickness of the border of an object.

• To change the thickness of a border, you need to declare it.

• To do this, you use the code: strokeWeight()

• The parentheses will be filled with a number.

• If you leave it blank, you will get no border.

To fill in a shape with colors, do the following:

• Use the code, fill(color).

• Choose what color you want to have inside of it.

• Place this code before the shape that you have created.

• It will continue to use this color until you create a new fill(color).

Other shapes...

• point= point(x, y)

• line= line(x1, y1, x2, y2) where these represent two sets of ordered pairs.

• arc= arc(x, y, w, h, start, stop) The start and stop are the two angles within the arc.

• 0 degrees=to the right

• 90 degrees= down

• 180 degrees= left

• 270 degrees= up

Other important information

• If you do not want shapes filled in, use the code: nofill()

• There are so many colors to choose from when you are creating your games.

• Spend time learning the code.

• You will be adding to these concepts.

• You will use it for your summative.

• You will be graded.

• To choose colors: https://www.rapidtables.com/web/color/RGB_Color.html

Sprites

• A character on the screen with properties that describe its location, movement, and look.

• Create them first:

• var sprite = createSprite(x,y)

• Property - A label for a characteristic of a sprite, such as its location and appearance.

• To choose a different sprite, use this code:

• sprite.setAnimation(label)

• There are a lot to choose from in Game Lab.

Multiple Select

Choose the correct descriptions of sprites.

• You must create them first using "var sprite".

• You can change the type of sprite with: sprite.setAnimation(label)

• They have a location on the Game Lab screen.

• They hold a lot of code inside them including location, movement, and look.

Poll

You will be graded on using this and other code when we get to our summative assessments, so it is important for you to learn it.

• Yes

• No