Skip to content

Please update your browser

Your browser version is not supported by this site. CS First may not work properly. Learn more

3. Customize Attributes

  • 1. Parallax Introduction
  • 2. Scrolling Objects
  • 3. Customize Attributes
  • 4. Add More Objects
  • 5. Add-Ons
  • 6. Reflection
  • 7. Wrap-up: Parallax
  • 8. Wrap-up: Share Your Project
  • 9. Wrap-up: Show Your Project
arrow_backward Back Next arrow_forward
Transcript

In this video, you will customize the object that passes by the sprite, and you’ll create a variable you’ll need for the parallax scrolling effect!

To start, select the "objects" sprite.

Add a new "when flag clicked" event, then under it, add the "switch costume" and "set y" blocks.

Click the costumes tab and check out the different costume options.

Switch the costume to whatever you like.

Click the flag, and press the right arrow key to test.

That looks good.

Tinker with the value in the "set y" block to change the object’s height.

Next, set the distance of the object from the walking sprite.

Create a distance variable.

Name the variable “distance,” and select "for this sprite only."

This step is important.

When a variable is "for all sprites," its value is shared between sprites, or between its clones.

So, when the variable is set in one sprite or clone, it changes the same variable in all the others!

When you choose “for this sprite only,” you’re making a local variable.

Local is the alternative to global – it means that only one sprite can use or change that variable’s value.

Global variables, however, can be accessed or changed by any sprite!

With local and global variables, it’s not that one is better than the other; you just use them in different situations.

If you want to share data between sprites – for instance, if one sprite needs to wait until another one is done talking – use a global variable, and set it to the person that should be talking.

Add a "set variable" block under the "set y" block, and make sure the distance variable is selected.

Choose a distance between 1 and 10.

Next, use the distance variable to set the size and speed of the background object.

Add a "set size" block.

The closer an object is, the larger it will appear.

The farther away an object, the smaller it will appear.

So, distance and size are inversely proportional: as one goes up, the other goes down.

Add a division block inside the "set size" block.

In the left blank, type 200.

In the right blank, add the distance variable.

If the distance is 2, then the size of the object will be 100%.

If the distance is greater, meaning that the object is farther away, then the size will be smaller.

For example, when the distance is 5, the size would only be 40%.

Click the flag to test.

Tinker with the value in the distance variable.

A big value in the distance variable makes the object look really small!

Next, program the objects to move faster or slower depending on their distance.

Speed and distance also have an inverse relationship.

The greater the distance between oneself and an object, the slower it appears to move by.

The current speed of the object is constant: when you press the arrow keys, the "objects" sprite moves at a rate of 20 steps.

To make the objects move at a speed based on their distance, add a division block into the "move" blocks under both "key pressed" conditionals.

In the first value of the first division block, put a negative number.

This example uses negative 20.

Divide that number by the distance variable.

In the first value of the second division block, put a positive number, and divide that number by the distance variable.

This example uses positive 20.

Click the flag to test, then continue to tinker with the value in the distance variable to see how this changes the size and speed of the sprite.

Now, it's your turn.

Set the costume and height.

Create a distance variable, and set the distance.

Set the size and speed of the sprite to be inversely proportional to the distance.

Instructions
  1. Set the costume and height.
  2. Create a distance variable, and set the distance.
  3. Set the size and speed of the sprite to be inversely proportional to the distance.