Blit Scrolling in a Tile-Based World - The Essential Guide to Flash Games - page 411

Using art-based MoveClip stage scrolling
In one type of traditional scrolling (in Flash at least), the game world would be laid out on a
MovieClip representing the entire world. This MovieClip would sit on the main timeline and would
be moved up down right and left to simulate scrolling. Because the main time line display window
was much smaller than the game world, scrolling was simulated. When done efficiently, this was
(and is) an easy but limited way to scroll a screen. With a large world made up of many vectors
the render engine would slow to just a few frames a second.

Note that newer versions of the Flash Player have cleaned up the art-based scrolling technique
somewhat. It is now possible to have a stage that scrolls many hundreds of MovieClip s with
those outside the viewable space being ignored. Still though, this method only allows for a limited
size game word as opposed to the blitted world we will create that essentially has limitless
boundaries.

GAS (GotoAndStop) tiles
One solution was to move to a tile-based method of timeline scrolling. The best way to represent
a 2D array of tiles was by placing each different tile skin (road, building, etc.) on a frame of a tile
clip and then use the “Go to and stop” method of jumping to a tile frame to change its display.
When tiles were placed in a 2D array on the screen and scrolled, a tile-based world was created.
“Go to and stop” (GAS) refers to the Flash time line control command, MovieClip.gotoAndStop .
We can think of the GAS method as a very early (for Flash) tile sheet. Each tile was put on its
own frame inside a MovieClip with a stop command in the Actions panel for the frame the tile was
on. Essentially, this created one, long timeline-based tile sheet. When the developer laid a grid of
tiles on the screen and then looped through them to change the look by using the gotoAndStop
command to change the viewable tile on each.
There were and are multiple different implementations of this method. Some placed all of the
world tiles on the timeline and moved them every frame (less efficient), and others placed just the
necessary ones on the screen (a view or camera) and changed just the needed ones. When
Flash started to be used for fast-action, high-speed games, both of these methods started to
show their deficiencies. The Flash engine was just not fast enough to sustain a high frame rate
with that many MovieClip s on the screen or create a very large world.

Using tile-based blit scrolling
There are a few different ways to use a blit canvas to scroll the screen. In this chapter, we will
discuss tile-based blit scrolling. In the next chapter, we will explore something called screen-
based blit scrolling. Tile-based blit scrolling is very similar in concept to a well-implemented GAS
scrolling design but allows for a much higher frame rate. We will use a 2D array of tiles (or tile
id s) that represent our world. We will not display the entire world anywhere on the screen but
rather copy the needed tiles for the current camera position to a buffer canvas, scroll the buffer to
the exact pixel location inside a 32 32 edge tile, and finally copy the buffer to our output canvas.

The World
The world is a 2D array (50 50) of tile values in our game. Each tile value (very similar to No

Tanks! in Chapters 6 and 7) is associated with a constant value such as WALL , ROAD , HEART , and
SKULL .