Tag: java

Programming with Scratch By Majed S. Marji Scratch is a simple, yet powerful, programming language that is intended to make computer programming easy and fun. It is different from the other programming languages in that it is visual. Instead of typing in your commands, you create your program by connecting graphical blocks together. In this article based on chapter 2 of Programming with Scratch, author Majed Marji shows you how to move sprites on the stage using the relative motion command blocks.

Relative Motion

Figure 1 shows a Scratch program that displays “Hello!” on the screen. The result from running this program is also shown in the figure.

^{Figure 1 This figure shows: (a) a simple Scratch program that contains a single command block, and (b) the result of running this program.}

The cat that you see in figure 1.1(b) is called a sprite. You can think of a sprite as a small robot that understands and obeys a predefined set of commands. You can give a sprite a different look by commanding it to use a different image, called costume. You can use an image of an airplane, snowman, your own photo, or anything else you like. The applications you create would typically contain more than one sprite, and your program will command these sprites to do certain things like move, turn, say something, play music, perform mathematical calculations, and so on. The area of the screen where your sprite move and interact with one another is called the stage.

Programming in Scratch is performed by snapping together “colored” command blocks, similar to putting together jigsaw puzzles or LEGO pieces. The stacked blocks that you create are called scripts.

Consider the grid depicted in figure 2, which shows a rocket sprite and a target (star) sprite. Here, the exact positions of these sprites on the stage are unknown as indicated by the absence of their (x,y) coordinates. If you were asked to give instructions to the rocket to hit the target, you might say, “First, move three steps, then turn right, then move two steps.” The effect of executing these instructions is also illustrated in the figure.

^{Figure 2 You can move a sprite on the stage using relative motion commands.}

Commands like “move” and “turn” are examples of relative motion commands. The first “move” command, for example, caused the rocket to move up, whereas the second “move” command caused the sprite to move to the right. In essence, the motion depends on (or is relative to) the current direction (or heading) of the sprite.

In addition to its current (x,y) position on the stage, the state of a sprite is also determined by its current direction. The direction convention used in Scratch is illustrated in figure 3. You can explicitly set the direction of a sprite using the command. You specify the direction by clicking the down arrow and selecting (up, right, down, or left) from the dropdown list or by typing in any value you want in the white edit box. Note that you can use negative values if you want. Typing 45 or -315, for example, causes the sprite to point northeast.

^{Figure 3 Direction convention used in Scratch: 0 (up), 90 (right), 180 (down), and -90 (left).}

With this newfound knowledge, let me introduce Scratch’s relative motion commands. These commands are summarized in table 1. I’ll demonstrate how to use these commands with the aid of simple examples.

Table 1 Relative motion commands in Scratch

Command	Description
	Moves the sprite in a straight line in the direction of its current heading. It takes an input number that indicates how far the sprite should move. A positive number causes the sprite to move forward, whereas a negative value causes the sprite to move backward.
	Changes the sprite’s x-position by a specified amount. This causes a horizontal (left or right) movement of the sprite.
	Changes the sprite’s y-position by a specified amount. This causes a vertical (up or down) movement of the sprite.
	Rotates the sprite clockwise in reference to its current direction. It takes an input number that indicates the required turn angle. A negative value results in a counterclockwise motion.
	Rotates the sprite counterclockwise in reference to its current direction. It takes an input number that indicates the required turn angle. A negative value results in a clockwise motion.

You can see the current direction of a sprite in the “sprite info area” of Scratch’s user interface (see figure 4).

^{Figure 4 Current sprite info area}

Another way to see this information is provided by the block. Clicking the checkbox next to this block allows you to see the sprite’s direction on the stage.

Using move and turn commands

Figure 5 illustrates how the move and turn commands work in relation to the current direction of the sprite. The first command causes the sprite to point up. The second command turns the sprite 45° clockwise. Then, the sprite moves 100 steps in its current direction (in other words, northeast). The last command turns the sprite 45° counterclockwise, which changes the sprite’s direction to the up position.

Figure 5 A simple script that illustrates using the move and turn commands

There are many other ways to implement this script and still have the same end result. For example, instead of commanding the sprite to point up then turn right 45°, we can directly command it to point in the direction of 45° using the command. Another way is to have the sprite point right, move some distance, turn left 90°, then move the same distance up. The scripts for these two alternatives are shown in figure 6. As you can see, the second script used the Pythagorean Theorem to calculate the horizontal and vertical distances.

^{Figure 6 Different scripts that produce the same result as the script of figure 5}

TRY IT OUT (1) – What do you think would happen if you used negative values in motion commands? Try the script shown in figure 7 to check your answer. (2) To know the direction of the sprite, check the box next to the block, then turn the sprite by different angles (using the turn commands). What values are displayed in the direction monitor box on the stage?

^{Figure 7 Using negative parameters in motion blocks}

Using “change x by” and “change y by” commands

Figure 8 shows a simple script that illustrates the effect of the and commands. The first command moves the rocket sprite to the center of the stage, setting its x-coordinate to 0 and its y-coordinate to 0. The command changes the x-coordinate to 50 (in other words, 0+50), which causes the sprite to move 50 steps to the right. The next command () changes the y-coordinate to 50, which causes the sprite to move up 50 steps. The (x,y) coordinates of the sprite after executing this command will be (50,50). When the second command is executed, the sprite will move additional 50 steps to the right ending at point (100,50). You should now be able to trace the motion of the sprite caused by this script, which is also illustrated in the figure.

^{Figure 8 A simple script that illustrates using the “change x by” and “change y by” commands}

Summary

Scratch programs (also called scripts) are created by snapping together command blocks that control graphical objects called sprites. You can give a sprite a different look by assigning it a different image, called costume. Sprites move and interact with one another on a background area called the stage. You can change the appearance of the stage by assigning it a different image, called background. Scratch has four kinds of blocks: command blocks, function blocks, trigger blocks, and control structure blocks.

In this article, you learned how to use relative motion commands to move sprites with reference to their own position and direction.

 

Here are some other Manning titles you might be interested in:

	Arduino in Action Martin Evans, Joshua Noble, Mark Sproul, and Jordan Hochenbaum
	The Well-Grounded Java Developer Benjamin J. Evans and Martijn Verburg
	Machine Learning in Action Peter Harrington