Bin image usage with LVGL v9


I have a project based on LVGL, I was using v8 according to my microcontroller’s sdk, then I had to move to v9 for bin font usage. I can use font bin file as expected but I have encountered an issue about images with using bin format. I have lots of images, I share just one. The problem is pictures look shifted on the screen. Why does that happen ?

What MCU/Processor/Board and compiler are you using?


What LVGL version are you using?

v9 with latest commits

What do you want to achieve?

I want see images on my screen with bin format.

What have you tried so far?

I have tried it with c file, it works fine. I have added rectangle to the picture’s right side to see the effect. Because there is space in original form of picture, that’s why I could not realize it.
I have used to produce C and Bin files. raw_fs is used to read bin files from flash.
Sample code is below for producing:
python lvgl/scripts/ --ofmt BIN --cf ARGB8888 --compress NONE --align 4 -o out_bin musicbackgroundicon.png

Code to reproduce

Add a code snippet which can run in the simulator. It should contain only the relevant code that compiles without errors when separated from your main code base.

The code block(s) should be formatted like:

void screen_main(void)
	//Write codes screen_main
	lv_obj_t *screen_main = lv_obj_create(NULL);
	lv_obj_set_size(screen_main, 800, 480);
	lv_obj_set_scrollbar_mode(screen_main, LV_SCROLLBAR_MODE_OFF);

	//Write style for screen_main, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
	lv_obj_set_style_bg_opa(screen_main, 0, LV_PART_MAIN|LV_STATE_DEFAULT);

	//Write codes _img_music
	lv_obj_t *img_music = lv_img_create(screen_main);
	lv_obj_add_flag(img_music, LV_OBJ_FLAG_CLICKABLE);
	lv_img_set_src(img_music, "F:/musicbackgroundicon.bin");
	//lv_img_set_src(img_music, &musicbackgroundicon);
	lv_img_set_pivot(img_music, 50,50);
	lv_img_set_angle(img_music, 0);
	lv_obj_set_pos(img_music, 100, 100);
	lv_obj_set_size(img_music, 174, 215);
	lv_obj_set_scrollbar_mode(img_music, LV_SCROLLBAR_MODE_OFF);

	//Write style for _img_music, Part: LV_PART_MAIN, State: LV_STATE_DEFAULT.
	lv_obj_set_style_img_recolor_opa(img_music, 255, LV_PART_MAIN|LV_STATE_DEFAULT);
	lv_obj_set_style_img_recolor(img_music, lv_color_hex(0x1d3248), LV_PART_MAIN|LV_STATE_DEFAULT);
	lv_obj_set_style_img_opa(img_music, 255, LV_PART_MAIN|LV_STATE_DEFAULT);

	//Update current screen layout.

	screen_main_del = true;

Screenshot and/or video

If possible, add screenshots and/or videos about the current state.
You can download pictures from here


My team leader solved this.
In src/libs/bin_decoder/lv_bin_decoder.c file, 394th line should be uint32_t offset = 12; instead uint32_t offset = 0;

Thank you for reporting the issue and posting the solution too.
@XuNeo have opened an issue for it on GitHub.

Next time, please open GitHub issues for bugs so that we will see it earlier.