Revision as of 06:58, 4 January 2013

Animation in SHIP

Animation is a common element of many GUIs. Whether a rotating fan, slowly filling indicator, or a glowing element, subtle animations can enhance a GUI and make it more professional and modern.

At the core of every animation is a series of images that, when rotated through in-place one after another, form the impression of an animated object.

Here is an example of three fan images, all in fully transparent alpha-blended .png format, designed to give the impression of a rotating fan:

Animation in SHIP is the process of cycling through a series of images at a certain rate, making each one visible in sequence with the others invisible.

SHIPTide Project Files for AN1001

Assuming you've downloaded and installed the SHIPTide Rapid GUI Development Environment, pick a target platform and download one of the following projects. Unzip the project to a directory of your choice and open up the project in SHIPTide.

• AN1001 SIM102  ↴ 
• AN1001 SIM110  ↴ 
• AN1001 SIM205  ↴ 
• AN1001 SIM225  ↴ 
• AN1001 Renesas YLCDRX63N  ↴ 

Basic Concepts

There are many ways to implement animation in SHIP; the attached project uses the concept of "grouped images" and demonstrates 4 different timer modes.

The three fan images, instead of being placed flat in the resources/images area, are placed in a named group. Exploring the project in SHIPTide the group looks like this:

Grouping the Images