I cannot display a jpg image from SD

How-to
1

Description: I’m trying to pull a jpg image from SD to display the image in a tabview tab. What am I doing wrong? What am I missing?

What MCU/Processor/Board and compiler are you using? ESP32 with an ILI9341

What LVGL version are you using? 9.1.0

What do you want to achieve? Display the image in a tabview tab.

What have you tried so far? I’ve tried multiple image formats on the SD card all with no success. I’ve read through the LVGL documentation but haven’t found anything that answers my question.

Code to reproduce

lv_conf.h sections
FS parts

#define LV_USE_FS_ARDUINO_SD 1
#if LV_USE_FS_ARDUINO_SD
    #define LV_FS_ARDUINO_SD_LETTER '\A'          /**< Set an upper cased letter on which the drive will accessible (e.g. 'A') */
#endif

Image Library Parts

#define LV_USE_TJPGD 1

INO parts

const char *imagePath = "A:images/jpeg/cedric.jpg";
lv_obj_t * wp;

//within a mainGUI()

lv_obj_set_style_bg_color(lv_screen_active(), lv_color_hex(0x003a57), LV_PART_MAIN);
tabview = lv_tabview_create(lv_screen_active());
lv_tabview_set_tab_bar_size(tabview, 40);
lv_obj_set_size(tabview, SCREEN_WIDTH, SCREEN_HEIGHT - 30); 

tab1 = lv_tabview_add_tab(tabview, LV_SYMBOL_HOME);
tab2 = lv_tabview_add_tab(tabview, LV_SYMBOL_DRIVE);
tab3 = lv_tabview_add_tab(tabview, LV_SYMBOL_LIST);
tab4 = lv_tabview_add_tab(tabview, LV_SYMBOL_SETTINGS);
tab5 = lv_tabview_add_tab(tabview, LV_SYMBOL_IMAGE);

if(fileExists(imagePath)){
  wp = lv_img_create(tab5);
  lv_img_set_src(wp, imagePath);
}

The file exists function

bool fileExists(String fileName){
	String fn = "/" + fileName.substring(2);
	Serial.println(fn);
	File file = SD.open(fn);
	if(!file){
		return false;
	} else {
		return true;
	}
	file.close();
}

Thanks, any help would be appreciated :wink:

2

Okay, so I figured that I hadn’t initialized the decoder in the setup

lv_bmp_init();    //BMP files

Also, I changed the images over to .BMP images (also tried corresponding inits for

  //lv_tjpgd_init();	// this is the init function from lv_tjpgd.h
  //lv_libpng_init();	// PNG files

but, still no image :sob:

3

when I used the lv_libpng_init I got a compile error saying that there was no png.h found …

4

You should set the drive letter in lv_conf.h to ‘A’, not ‘\A’, but also I’d set these in lv_conf.h:

#define LV_USE_LOG 1

and

#define LV_LOG_LEVEL LV_LOG_LEVEL_INFO

and see what output it gives, it will help a lot to diagnose issues here

5

Thanks, I’ll give that a try :wink:

6

For the libpng issue, check the docs here - libpng decoder

You will need to install and add libpng libraries to your build, it won’t compile ‘out of the box’.

7

Ahhh … there’s my problem :slight_smile: I’m using Arduino IDE and I don’t seem to be able to find an Arduino library for libpng.

8

Okay, so … I’ve made a simplified INO script to test my configuration:

#include <lvgl.h>
#include <TFT_eSPI.h>

#define SCREEN_WIDTH 320
#define SCREEN_HEIGHT 240

#define DRAW_BUF_SIZE (SCREEN_WIDTH * SCREEN_HEIGHT / 10 * (LV_COLOR_DEPTH / 8))
uint32_t draw_buf[DRAW_BUF_SIZE / 4];

const char *imagePath		= "A:images/jpeg/cedric.jpg";

//image object
static lv_obj_t * wp;

void log_print(lv_log_level_t level, const char * buf) {
  LV_UNUSED(level);
  Serial.println(buf);
  Serial.flush();
}

void mainGUI() {  
  lv_obj_set_style_bg_color(lv_screen_active(), lv_color_hex(0x003a57), LV_PART_MAIN);
	wp = lv_img_create(lv_screen_active());
	lv_img_set_src(wp, imagePath);
	lv_obj_center(wp);
}

void setup() {
  delay(3000);  //power-up safety delay
  String LVGL_Arduino = String("LVGL Library Version: ") + lv_version_major() + "." + lv_version_minor() + "." + lv_version_patch();
  Serial.begin(115200);
  Serial.println(LVGL_Arduino);

  lv_init();

  lv_log_register_print_cb(log_print);

	lv_fs_stdio_init();
  lv_tjpgd_init();
  lv_display_t * disp;
  disp = lv_tft_espi_create(SCREEN_WIDTH, SCREEN_HEIGHT, draw_buf, sizeof(draw_buf));
  mainGUI();
}

void loop() {
  lv_task_handler();  // let the GUI do its work
  lv_tick_inc(5);     // tell LVGL how much time has passed
  delay(5);           // let this time pass
}

The relevant parts of lv_conf.h are:

#define LV_USE_FS_STDIO 1
#if LV_USE_FS_STDIO
    #define LV_FS_STDIO_LETTER 'A'
    #define LV_FS_STDIO_PATH ""
    #define LV_FS_STDIO_CACHE_SIZE 0
#endif

#define LV_USE_TJPGD 1
#define LV_LOG_LEVEL LV_LOG_LEVEL_INFO

When I compile to the ESP32 the Serial monitor shows

LVGL Library Version: 9.1.0
[Info]	(0.000, +0)	 lv_init: begin lv_init.c:139
[Info]	(0.000, +0)	 lv_obj_create: begin lv_obj.c:100
[Info]	(0.000, +0)	 lv_obj_create: begin lv_obj.c:100
[Info]	(0.000, +0)	 lv_obj_create: begin lv_obj.c:100
[Info]	(0.000, +0)	 lv_obj_create: begin lv_obj.c:100
[Info]	(0.000, +0)	 lv_image_create: begin lv_image.c:123
[Warn]	(0.000, +0)	 lv_image_set_src: failed to get image info: A:images/jpeg/cedric.jpg lv_image.c:174

My SD card has a file /images/jpeg/cedric.jpg

Thanks for your help, so far egonbeermat