LodePNG decoder

Allow the use of PNG images in LVGL.

Detailed introduction: https://github.com/lvandeve/lodepng

If enabled in lv_conf.h by LV_USE_LODEPNG LVGL will register a new image decoder automatically so PNG files can be directly used as any other image sources.


a file system driver needs to be registered to open images from

files. Read more about it File system or just enable one in lv_conf.h with LV_USE_FS_...

The whole PNG image is decoded, so width x height x 4 bytes free RAM space is required. The decoded image is stored in RGBA pixel format.

As it might take significant time to decode PNG images LVGL's Image caching feature can be useful.

Compress PNG files

PNG file format supports True color (24/32 bit), and 8-bit palette colors. Usually cliparts, drawings, icons and simple graphics are stored in PNG format, that do not use the whole color space, so it is possible to compress further the image by using 8-bit palette colors, instead of 24/32 bit True color format. Because embedded devices have limited (flash) storage, it is recommended to compress images.

One option is to use a free online PNG compressor site, for example Compress PNG: https://compresspng.com/


Open a PNG image from file and variable

#include "../../lv_examples.h"

 * Open a PNG image from a file and a variable
void lv_example_lodepng_1(void)
    lv_obj_t * img;

    img = lv_image_create(lv_screen_active());
    lv_image_set_src(img, &img_wink_png);
    lv_obj_align(img, LV_ALIGN_LEFT_MID, 20, 0);

    img = lv_image_create(lv_screen_active());
    /* Assuming a File system is attached to letter 'A'
     * E.g. set LV_USE_FS_STDIO 'A' in lv_conf.h */
    lv_image_set_src(img, "A:lvgl/examples/libs/lodepng/wink.png");
    lv_obj_align(img, LV_ALIGN_RIGHT_MID, -20, 0);