How to Add Image with Image Palette - mchpgfx/legato.docs GitHub Wiki

Microchip Technology Deducing Image Storage Space with Image Palette

Introduction - Image Palette

The Image Palette feature reduces the non-volatile memory storage space required for an image by converting each pixel into an 8-bit index of a color look-up table. The Color Look-Up Table (CLUT) contains up to 256 colors. See this Wikipedia entry for more information about indexed color.

Legato supports image palette in RGB565, RGB888, or RGBA8888. All 256 entries has to be of the same color gamut.

Legato Composer does not generate the image palette. The image palette has to come from the image asset and an image palette entry is made at image import. The image palette is then stored as an entry in the image asset table. To further reduce non-volatile storage requirements, multiple indexed images can reference the same image palette.

Image Palette is a separate feature from Global Palette but the features can be used in conjunction. When both features are used, the entries of the Image Palette CLUT turns into index reference to the Global Palette CLUT.

Setting Up An Image with a Palette

Images may or may not have a CLUT embedded in its data. For images that do not have a CLUT, here are the steps to generating one using GIMP.

  1. Open the image in GIMP, select Image -> Mode -> Indexed from the menu.

Image In GIMP

  1. This will bring up Index Color Conversion window. Make sure 'generate optimum palette' and maximum 256 colors are set. Press Convert.

Index Color Conversion Window

  1. Select File -> Export As... from the menu

Export the Image

  1. Leave Run-Length Encoded unselected. Press Export.

Export the Image Window

Importing Palettized Image into Composer

The Graphics Composer detects if the image has a CLUT or not at import. Here are the steps in details.

  1. Bring up the Image Manager by selecting Asset -> Images in the Graphics Composer menu. Select Import RGB Image.

Image Manager

  1. A pop-up will appear indicating the Graphics Composer has detected the image has a CLUT. Select Separate into Palette and Color Map.

Image Manager

  1. After the image is successfully imported. There will be two entries: one is the Image Palette, the other is the color map/CLUT. Click on the image entry. Note that the Output Format is fixed to Indexed and the Palette Image in the Color Map Settings is set the color map/CLUT.

Image Manager

  1. Click on the color map/CLUT entry. Note the color entries within the color map/CLUT is rendered. You can click on the zoom buttons up top to view in greater detail. Also note under the Palette Settings that the Color Mode can be adjusted. Set this to match the Renderer Color Mode in the Project Settings for best performance.

Image Manager

The image and color mode is now ready to use.