LVGL image becomes white

ESPHome
1

I get the following error:

[11:04:57.486][W][lvgl:000]: lv_img_decoder_built_in_open: Image decoder open: unknown color format 	(in lv_img_decoder.c line #464)
[11:04:57.488][W][lvgl:000]: _lv_img_cache_open: Image draw cannot open the image resource 	(in lv_img_cache.c line #125)
[11:04:57.497][W][lvgl:000]: lv_draw_img: Image draw error 	(in lv_draw_img.c line #84)
[11:04:57.507][W][lvgl:000]: lv_img_decoder_built_in_open: Image decoder open: unknown color format 	(in lv_img_decoder.c line #464)
[11:04:57.511][W][lvgl:000]: _lv_img_cache_open: Image draw cannot open the image resource 	(in lv_img_cache.c line #125)
[11:04:57.520][W][lvgl:000]: lv_draw_img: Image draw error 	(in lv_draw_img.c line #84)
[11:04:57.520][W][lvgl:000]: lv_img_decoder_built_in_open: Image decoder open: unknown color format 	(in lv_img_decoder.c line #464)
[11:04:57.521][W][lvgl:000]: _lv_img_cache_open: Image draw cannot open the image resource 	(in lv_img_cache.c line #125)
[11:04:57.525][W][lvgl:000]: lv_draw_img: Image draw error 	(in lv_draw_img.c line #84)
[11:04:57.531][W][lvgl:000]: lv_img_decoder_built_in_open: Image decoder open: unknown color format 	(in lv_img_decoder.c line #464)
[11:04:57.534][W][lvgl:000]: _lv_img_cache_open: Image draw cannot open the image resource 	(in lv_img_cache.c line #125)
[11:04:57.539][W][lvgl:000]: lv_draw_img: Image draw error 	(in lv_draw_img.c line #84)

when I have this:

image:
  - file: "/config/esphome/images/c-picker.png"
    id: img_config_esphome_images_c_picker_png_466x466
    type: RGB
    resize: 466x466

lvgl:
  on_boot:
    - lambda: |-
        lv_obj_set_style_anim_time(id(w_mmxjs5alsiblt), 800, LV_PART_MAIN);
  id: my_lvgl
  log_level: WARN
  bg_color: "0x000000"
  displays:
    - main_display
  pages:
....
....
    - id: page_3
      widgets:
        # widget:lvgl_img id:w_mnfs3ci6x1ece type:lvgl_img x:0 y:0 w:466 h:466 src:"/config/esphome/images/c-picker.png" color:"theme_auto"
        - image:
            id: w_mnfs3ci6x1ece
            angle: 0
            height: 466
            image_recolor: "0xFFFFFF"
            image_recolor_opa: cover
            pivot_x: 0
            pivot_y: 0
            src: img_config_esphome_images_c_picker_png_466x466
            width: 466
            x: 0
            y: 0

I’m trying to create a color wheel picker page, but I can’t even get the image to display. I also tried with type: RGB565 but that didn’t either work.

The image is a screencapture of the color wheel in HA, saved as png with windows screencapture app.

EDIT; The two lines with image_recolor does not make any difference. The image is still just white with a small text “No data”.

2

What type of screen are you using? Have you verified it works with other images? Do you have a link to the image so we can look at it?

3

It’s this image:

c-picker
c-picker356×357 19.9 KB

on this display:

https://www.aliexpress.com/item/1005008424118832.html

I don’t know if it works with other images. I don’t think I have tried.
But the preloaded firmware had images.
I can try with some other image.

4

Finally found a small enough file. No it didn’t work with another file. Still says no data.

5

By some reason it worked now with RGB565.

image:
  - file: "images/c-picker.png"
    id: img_config_esphome_images_c_picker_png_466x466
    type: RGB565
    resize: 466x466

perhaps it was the file path.
I might have missed trying that specific setting, both RGB565 and the relative path.
But this works,…

6

Yup that’s the image type you have so that will work.