I read on the wiki that LVGL supports PNG and JPG, yet for some reason i am unable to open JPG.
Which is unfortunate because i can get reasonable quality for 1/6th the size of a PNG
My original full quality image was 200kb. I saved it with low quality parameters (8 bit) as a PNG and still had reasonable quality, now only 30kb. saving at JPG, i could go down to 7kb before it was no longer acceptable!
Now im wondering, what is the most efficient way / format to save images to have the very lowest size, assuming quality can be compromised a little bit?
Are there known tricks to reduce size?
Your question is not right. Real reply is no compress, because any slow down your rendering capacity. But in critical situation good is for example store png or jpg, and on app load decompress all into ram cache. But here you see lowest flash = bigger RAM required…
Maybe you dont understand what is format of image in your code…
And on other thread you ask video, but seems you completely unread docs GIF decoder — LVGL documentation
and other parts 3rd party…
If you want JPG support you can try SJPG: JPG decoder — LVGL documentation
But maybe GIF or other reduced-colordepth/indexed palette format images would be small enough and uncompress faster.
SquareLine Studio can export code that uses pictures directly, using ‘BinaryLVGL’ format, selectable in project settings. Albeit it expects PNG you can play around in the exported code with different image encoding formats, whichever fits best. (GIF decoder — LVGL documentation or BMP decoder — LVGL documentation )
Do you know if it changes the file size of my pictures?
Say, my 75x75 Pixel icons were 20-30kb, i reduced PNG quality down to 1.5 ~ 3 kb average. Its still 75x75 PNG
Does LVGL convert it in such a way that 75x75 pixel will take roughly the same amount of space regardless of the file i used?
My backgrounds were 200kb (480x272) , i shrinked it to 30kb with the same PNG format. Im just wondering if its pointless effort or not. Because say, the JPEG version was 7kb, but then i re-saved it to PNG and it went back to 30KB. Would LVGL’s own file format do this?
I am working with a friend, he is the programmer. Im just making the Squareline stuff as the UI engineer. No need to be negative, no i did not read all the LVGL documentation, this is a Squareline forum.
That seems to be the purpose of squareline in the first place, making it more accessible to people who arent good programmers. My programmer friend deals with the rest, but hes not knowledgeable about pictures and graphic design so i ask here.
Sorry , but you as UI engineer require knowledge about image formats and MCU gui capabilities.
Every code on planet for show image must decode it for display, that cost time energy …
FYI normal standart is prepared image in code for most quick show = decoded. Irelevant what you do with png jpg etc. For your example 75x75 for project with 16bit colorspace is decoded and placed in flash as 11250 bytes. If transparency used + next 5625
And yes you can use encoded and sw decoder, but for this MCU require
" The whole PNG image is decoded so during decoding RAM equals to image width x image height x 4 bytes are required.
As it might take significant time to decode PNG images LVGL’s images caching feature can be useful."
I require knowledge, hence why im asking here for this extremely specific application
i used to do videogame GUI which honestly was absolutely no concern since modern gamers have 64 GB of RAM with 8GB VRAM Graphic cards.
Working with microcontrollers is new to me, especially LVGL, so im trying to learn more.
FYI nothing specific here. For example you have image 800x600 24bit full quality.
Store into lvgl flash have more variants RGB565 without transparency = 800x600x2
with transparency 800x600x3, or png or jpg sizes flash requirments down…
But for show it in lvgl app for png or jpg your code require 800x600x4 free RAM space on runtime, instead no RAM required for RGB stored.
