## Clock

You can create clocks to match the overall theme design. The digital or analog clock is displayed on the context pane of the idle view. The mobile phone user can select the clock type displayed. The same clocks are displayed in the Clock application.

### Analog clock

The analog clock consists of five parts:

- Face1
- Current date frame
- Face2
- Hour pointer
- Minute pointer

The figure below illustrates a default analog clock and a customized analog clock.
A theme may alter the graphics used, however, the outlook and position of the pointers and the date numbers are fixed. Use the Face1 image to render the basic clock table and possible background effects. The image may contain clock numbers, a shadow color, or a halo effect. Current date frame is used as a background for the date indicator in the right-center of the clock face. The Face2 image sets the highlight of the clock; it is drawn on top of the rest of the images.
Pointer graphics must always start from the exact center of the bounding box to position the hands correctly. You can use all the listed clock graphics. The analog clock date numbers are not shown.
Figure: Default and customized analog clock

### Digital clock

The digital clock consists of masked number and separator character images. Each individual number and separator consists of two images. The first image contains the character and possible effect color or texture. The second image contains a hard mask to create clear characters. The images overlap in the clock area in accordance with a fixed position. The digital clock is created in two steps:

- Background effect creation
- Character creation

To create the background effect, use the first image. Mask the character image with the second image in order to put different types of effects, such as a shadow or halo to the background. When displayed in a mobile phone, the images overlap one another. The number or separator character images get masked from the second image, so the characters are drawn on top and the effects are on the underlying layer. In order to ensure that the characters do not overlap, they need to be placed in a defined ‘safe’ area.
The figure below illustrates a default digital clock and a customized digital clock.
Figure: Default and customized digital clock