Creating Skins for HUM mp3 Player

CESD-S-0073

Applies To:

  • Windows CE 2.0, SP1
  • Handheld PC Professional, SP1
  • Handheld PC 2000

Overview:

This article provides an overview of the steps involved in creating skin files for the Utopiasoft HUM mp3 player.


How-to Guide:

It is best to start from an existing skin. The skin in Utopiasoft Hum are standard Windows bitmaps. You can use any bitmap editing tools like Windows' Paint to edit them.

To change the appearance of Hum, simply replace the background and button up and down state bitmaps with your own designs. Use the mask bitmaps as a guide for the size and shape of the different buttons.

Note that the black areas of the mask bitmaps define the areas of the corresponding button bitmaps which will actually be drawn on the screen.

It is recommend that you only use 256-color bitmaps for skin bitmaps to save storage space on your device. For mask bitmaps, they have to be monochrome (2-color). Please verify this carefully before copy them to your HPC/PPC.

The bitmaps which Hum uses are as follows:

  • Background:
    Skin.bmp

  • Play button:
    Play_u.bmp - up state
    Play_d.bmp - down state
    Play_m.bmp - mask

  • Stop button:
    Stop_u.bmp - up state
    Stop_d.bmp - down state
    Stop_m.bmp - mask

  • Pause button:
    Pause_u.bmp - up state
    Pause_d.bmp - down state
    Pause_m.bmp - mask

  • Next button:
    Next_u.bmp - up state
    Next_d.bmp - down state
    Next_m.bmp -  mask

  • Previous button:
    Prev_u.bmp - up state
    Prev_d.bmp - down state
    Prev_m.bmp - mask

  • Playlist button:
    Plist_u.bmp - up state
    Plist_d.bmp - down state
    Plist_m.bmp - mask

  • About Hum button:
    About_u.bmp - up state
    About_d.bmp - down state
    About_m.bmp - mask

  • Mute / Unmute button:
    Mute_u.bmp - mute up state
    Mute_d.bmp - mute down state
    Unmute_u.bmp - unmute up state
    Unmute_d.bmp - unmute down state
    Mute_m.bmp - mask

  • Exit button:
    Exit_u.bmp - exit up state
    Exit_d.bmp - exit down state
    Exit_m.bmp - mask

Notes:

  1. The names of the bitmaps cannot be changed.
  2. If any button is missing one of its bitmap files (including xxx_m.bmp), or if any of the button bitmap files has been named incorrectly, that button will be drawn with the Hum default style.
  3. If the background bitmap is missing, Hum will be drawn in the default style including all the buttons.
  4. In Hum v1.6, button positions and shapes are fixed.

How to install a skin?

When you install Hum a Skin directory will be created in \Program Files\Utopiasoft\Skin on your device. If not, just create this directory using ActiveSync.

Finally, copy all the skin files on your PC into the Skin directory. Restart Hum and you new skin will be applied to the player.