Distortion effect of image display

Bugs
1

What do you want to achieve?

I use the image widget in SLS to display a png image with gradient effect, the display effect in SLS editor is not smooth.

What have you tried so far?

SLS 1.4.0

Screenshot or video

source image:
test

effect in SLS editor
image

Others

SquareLine Studio version: 1.4.0
Operating system: Windows 11
Target hardware: simulator

2

OK for RGB565

3

Thanks, can you please elaborate how to configure to RGB565 in SLS? currently the color depth setting is 16bits. The following is the configurations of tc source file for the image.

const lv_image_dsc_t test = {
.header.cf = LV_COLOR_FORMAT_RGB565,
.header.magic = LV_IMAGE_HEADER_MAGIC,
.header.w = 593,
.header.h = 335,
.data_size = 198655 * 2,
.data = test_map,
};

4

5+6+5 = 16

5

You should use 32bit color depth in SquareLine Studio (project settings) or prepare the 16bit image with some dithering for a closer match to the original gradient. (Btw you can make gradients in SquareLine Studio, no need to import them as picture, they look better with 32bit colour-depth.)

Also, there’s a setting in lv_conf.h to create dithering in gradients by code: LV_DITHER_GRADIENT

1 Like