Scrolling sprites

Description

Many games may require the ability to scroll the screen. AppGameKit Studio assists with this process by providing a few simple commands to easily and efficiently scroll the screen. This example will show the following:

External media

This example program relies on several images:

pitch_top.jpg

goals_logo.png

pitch_bottom.jpg

Overview

The process involved is as follows:

Within the main loop:

Creating our pitch

This example has two external images - pitch_top.jpg and pitch_bottom.jpg. As the names suggests one image contains the top of the pitch, while the other image contains the bottom half of the pitch. Both of these images are loaded, sprites are created and finally they are positioned to align correctly:

LoadImage ( 1, "pitch_top.jpg" )
LoadImage ( 2, "pitch_bottom.jpg" )

CreateSprite ( 1, 1 ) CreateSprite ( 2, 2 )
SetSpritePosition ( 1, 0, 0 ) SetSpritePosition ( 2, 0, 593 )

Create a fixed sprite

Within the main loop, when we adjust the view offset (that controls scrolling) our pitch sprites will be moved about. There may be cases where this behaviour isn’t required for certain sprites, for example, interface elements might be fixed to the screen. When this behaviour is required, all it takes to stop a sprite from scrolling is to call the command FixSpriteToScreen. This command has two parameters - the ID number of the sprite and then a value controlling whether the sprite is fixed to the screen (a value of 1), or if the sprite is fixed to the world (a value of 0). In our example this new sprite will remain at the top left corner of the screen:

LoadImage ( 3, "goals_logo.png" )
CreateSprite ( 3, 3 )
FixSpriteToScreen ( 3, 1 )

Main Loop

To scroll our sprites we need to make a call to the command SetViewOffset. This command has two parameters - an offset on the X axis and an offset on the Y axis. By default these values will be 0 and 0. As the X value is increased our sprites will be shifted to the left, while a decrease in the X value will shift sprites to the right. Increasing the Y value will shift sprites up, decreasing it will shift them down.

The code being used in this example will scroll in one direction for a short while, before returning to the original position and then repeating the process. Here’s the code:

do
    SetViewOffset ( x, y )

if ( direction = 0 ) x = x + 1 y = y + 2
if ( y > 740 ) direction = 1 endif endif
if ( direction = 1 ) x = x - 1 y = y - 2
if ( y < 0 ) direction = 0 endif endif
sync ( ) loop

Full code listing

Everything is now in place. Here's the final code for our program:

SetVirtualResolution ( 320, 480 )

LoadImage ( 1, "pitch_top.jpg" ) LoadImage ( 2, "pitch_bottom.jpg" )
CreateSprite ( 1, 1 ) CreateSprite ( 2, 2 )
SetSpritePosition ( 1, 0, 0 ) SetSpritePosition ( 2, 0, 593 )
LoadImage ( 3, "goals_logo.png" ) CreateSprite ( 3, 3 ) FixSpriteToScreen ( 3, 1 )
do SetViewOffset ( x, y )
if ( direction = 0 ) x = x + 1 y = y + 2
if ( y > 740 ) direction = 1 endif endif
if ( direction = 1 ) x = x - 1 y = y - 2
if ( y < 0 ) direction = 0 endif endif
sync ( ) loop

Conclusion

As you can see from this example AppGameKit Studio makes the task of scrolling your screen very simple.