Game Development Reference
In-Depth Information
Chapter
12
Visual Effects and Animations
In this chapter, you'll learn how to create sprite frame animations, how to design particle
effects, and how to apply shader effects via the Effect node, which is essentially a sprite's
effects list.
Sprite Frame Animations
A common way to animate sprites is by cycling through a series of images. This is called a
sprite frame animation . In essence, it's the same as changing a sprite's texture every so of-
ten.
The term sprite frame refers to an extra class, CCSpriteFrame , provided by Cocos2D,
which has a reference to the texture plus extra information to address the sprite as an area
within the texture. Often, the texture is in fact a Sprite Sheet texture, and the CCS-
priteFrame class contains information where a specific image can be found within the
texture.
Creating a Sprite Frame Animation
In the SpriteSheets/Global Sprite Sheet, you should find images named player-anim1.png
through player-anim3.png .
If they aren't there, check the Graphics archive that came with the topic. Inside the Global
folder, you will find those images, drag and drop them from Finder onto the SpriteSheets/
Global Sprite Sheet to add them. You can also use your own series of images as long as
they have the same dimensions as the existing player.png .
Now when you select all three player-anim#.png images in the SpriteSheets/Global Sprite
Sheet and right-click to bring up the context menu, you'll see the same menu item high-
lighted in Figure 12-1 . But don't click on this menu item just yet.
Search WWH ::




Custom Search