Clipping via Sprite Masking

Clipping is the computer graphics term for choosing which parts of a graphical object to display or hide. In 2D graphics, it’s very common to use one image to define parts of a screen to either only show other images or to never show other images. Such an image is known as an image mask. In this recipe, we’ll use two related images. One is an image of the inside of a room, showing a panel out to a night skyscape. The second image is transparent, except for the rectangle where the panel is. We’ll use the second image to only allow other sprites to be seen when they pass by the rectangle panel. The following figure shows how we can only see the parts of the moving blue bird sprite when it is overlapping with the rectangle panel:

Figure 8.62: Image mask being used to only show the bird when it flies through the window rectangle area of the screen

Getting ready

For this recipe, we have prepared the files you need in the...