Graphics:Sprites

From Adonthell
Jump to navigation Jump to search

Here we learn how to build the fundamental graphical objects used by the Adonthell Engine.

Definition

A sprite combines all graphics that are required to represent a single object (like a tree or a character) in all its possible states. Each state corresponds to an animation, a series of one or more images.

Building a Sprite

Sprites are defined in an XML file. While in the future there might be a graphical editor to simplify the task, for now these files have to be created manually.

A simple Sprite

The file for the most simple possible sprite, an object with just one state that is not animated, looks as follows:

<?xml version="1.0"?>

  <list id="default">
    <list id="gfx/map/ground/outside/grass/grass-tile.png">
      <bool id="mask">0</bool>
      <bool id="mirrored_x">0</bool>
      <u_int32 id="delay">0</u_int32>
    </list>
  </list>

In fact, in this case the sprite description can be omitted completely, as the Adonthell Engine will automatically convert single PNG images into the same sprite. However, this does not work for objects that are animated and/or which have multiple states.

An Animation

Animations can be defined by specifiying multiple images with a delay the tells the engine when to switch to the next frame. An example might be grass that is moving in the wind:

    ...
    <list id="gfx/map/ground/outside/grass/grass-tile-1.png">
      <bool id="mask">0</bool>
      <bool id="mirrored_x">0</bool>
      <u_int32 id="delay">250</u_int32>
    </list>
    <list id="gfx/map/ground/outside/grass/grass-tile-2.png">
      <bool id="mask">0</bool>
      <bool id="mirrored_x">0</bool>
      <u_int32 id="delay">250</u_int32>
    </list>
    <list id="gfx/map/ground/outside/grass/grass-tile-3.png">
      <bool id="mask">0</bool>
      <bool id="mirrored_x">0</bool>
      <u_int32 id="delay">250</u_int32>
    </list>
    ...

The delay is specified in milliseconds. Once the last frame of the animation has been reached, the engine will automatically jump to the first frame. It is possible to use the same image in different frames; in fact, this will preserve a bit of memory as the engine will load each image only once.

To create an animation that plays only once (like opening or closing a door), set the delay of the last frame to zero. This will tell the engine to stop. Otherwise it will be up to scripting to pause or play back animations.

Multiple States

Sprites with multiple states can be created by adding multiple animation sequences to the file. The following is a grass tile that can be optionally covered by snow:

  ...
  <list id="default">
    <list id="gfx/map/ground/outside/grass/grass-tile.png">
      ...
    </list>
  </list>
  <list id="winter">
    <list id="gfx/map/ground/outside/snow/snow-tile.png">
      ...
    </list>
  </list>
  ...

In this case, the sprite contains the two states default and winter. Again, it is in the hands of a script writer to set a sprite's state accordingly.

Additional Parameters

As seen in the examples above, there are two more parameters that have to be specified for each image of the sprite.

  • mask
    If set to 1, the engine converts pixels of color #FF00FF (magenta) to transparency. While this allows smaller images size (since no alpha channel is needed), the use of this flag is discouraged for simple sprites, as it requires the use of a sprite definition file where otherwise a single PNG in RGBA format would have sufficed.
  • mirrored_x
    If set to 1, the image will be mirrored along the vertical axis. This can be useful for walking animations, where walking east and west might just be mirrored versions of the same images.

Conventions

While sprites can be built quite freely, as long as adhering to the format above, there are a few things to keep in mind.

Alignment of Animation frames

All images that are part of an animation need to have the same size. There is no way for the engine to align the different frames. You will have to do this as part of the image creation process. Different animations need not have the same size, however.

State Names

Certain categories of objects are expected to have a predefined set of states. For now, this only applies to character (and creature) sprites, which have to contain (at least) the following states:

  • e_stand, s_stand, w_stand, n_stand
    Standing still, facing either east, south, west or north.
  • e_walk, s_walk, w_walk, n_walk
    Walking at normal speed, either east, south, west or north.
  • e_run, s_run, w_run, n_run
    Running, either east, south, west or north.

Additional states can be added, of course, but these will not be triggered automatically.