Best background option for system view/gamelist
Hi, I'm currently creating a theme and adding png backgrounds to both the system view and the gameslist view.
I currently have them as 1920x1080 px in size and placed as the background with the image in the art directory.
My questions are:
1- What is the best way to go about this to make sure its not too heavy? (currently I have the images compressed to approx. 300kb)
2- Is it best to slice the images into sections and place as <image name="section_top" extra="true"> individually?
I only ask this question as I've read that 1920x1080 images can slow down the pi3 and have that 'flash' of white on the screen when selecting systems.
I'm currently using the carbon theme as my starting point and running on a pi3.
Hope anybody can help and point me in the right direction.
Thanks in advance,
TMNTturtlguy last edited by
@paffley thanks to @Nismo suggestions to me, your 1920x1080 should be 512kb or less. So it sounds like your file sizes are ok. Depending on what your images look like, you could use 1280x720 instead. This looks great on most screens and I have found it still looks really nice even on my 4K TV. The white flash is definetly an issue with large images especially when running at lot of themes. If you plan to run only a few themes, it will be less of an issue. In my opinion I would not cut your background into 3 parts, what you could do however is place smaller elements over the background if that would work for your theme. Lastly, if the white flash starts to become an issue, you may be able to remedy that by using the fade transition instead of slide, or adjusting the vram up or down. Bottom line is if you are doing a lot of different backgrounds for each system you will just need to do a lot of trial and testing to see what works best. Good luck! If you want to see how I did mine you can check out the comic book theme thread. I have been working through the same issues you are asking about.
Hey TMNTturtlguy, that is super advice thank you so much! Everything you said makes sense. Love your theme by the way, keep up the great work!
I Think I will try different elements and adjust some settings, I'll let you know if I accomplish the white flash - I'm currently running 9 systems and want to get to around 15 in total. Ill keep you posted.
Thanks again! much appreciated! :)
Nismo last edited by Nismo
The "white screen of dead" issue was fixed, so you don't need to worry about that, you only need to worry about performance.
As far I know the memory works by "levels" so for anything below 128kb it's the same than 128kb.
The same occurs with 256kb and 512 kb.
If your images are 300kb it will use the same memory than 512kb images. So you have two options, reduce the image quality a bit to be less than 256kb and increase the performance, or increase it to a bit less of 512kb so it will use the same amount of memory but the image quality it's better.
For me, best compromise between quality and filesize it's a bit less of 512kb for 1080p images and a bit less than 256kb for 720p images.
About splitting images, I don't like to do it if I can avoid it, just for the same reason.
Sorry but my english it's not very good, I hope you understand what I mean.
Hey thanks Nismo! that makes total sense so thank you! both of your info has been a massive help!
Your English is very good no need to worry! :)
TMNTturtlguy last edited by
@Nismo thanks for the detailed info! I now understand the file size limits better! I had no idea that each file size has an effect on the memory in that way. What happens after 512kb? I didnt know the memory could exceed 256? I better go back through a few of my own files again. I think on a few riot left them slightly over 512 during compression so I better go back and force them below 512! Thanks again
Nismo last edited by Nismo
hat happens after 512kb? I didnt know the memory could exceed 256?
Then it will use 1024kb.
Extracted info about memory split on github: https://github.com/RetroPie/RetroPie-Setup/wiki/Memory-Split
"note that in order to ensure sensible memory splits across Pi models, RetroPie utilises the gpu_mem_256, gpu_mem_512 and gpu_mem_1024 overrides, which apply to Pis with that amount of memory (for example, the Pi 2 has 1024MB memory, so will use the gpu_mem_1024 setting). This setting overrides the gpu_mem setting"
In this topic you can find a lot of info: https://retropie.org.uk/forum/topic/2389/solution-for-white-screen-of-death/12
Keep in mind this info it's before white screen fix was released:
There's a minimum amount of VRAM required to display certain size wallpapers. If you have just 1, 1920x0180 wallpaper, you MUST have 256 meg RAM split. But that 256 RAM split will take you up to 10 or so wallpapers. The next jump is probably 512 split. Which should still be just fine with most of the emulators that the Pi can handle.
You can make sure your theme wallpapers are 720p and that will help you with the RAM issues. ES was not designed for the Pi, but it works.
The Carbon theme was designed for the Pi's limited video RAM just for the white screen problems. If you're going to make some custom themes, try thinking in 'parts' instead of 'wallpapers.' Several 512x512 images take less VRAM than a 1920x1080 wallpaper. Try to re-use elements so ES doesn't have to fill VRAM with a massive picture.
That is very strange. A 10x10 pixel image will take the VRAM of a 16x16 image. Everything unwraps to a power of 2. As long as these images are not SVGs. An SVG stretched to full screen takes a canvas to display, and that canvas takes the full VRAM of that area. So even if the SVG has a single line in it, and the file size is 0.5kb, it will take the same VRAM as a 1080p PNG uncompressed. Fonts shouldn't take too much RAM, and they are regular RAM.
@TMNTturtlguy and for this last thing it's because I told you don't use so many svg files... Rpi can handle pngs very well, I only use svg for system logo, you have 3 svg on each system folder.
But we still can read a bit more of interesting info:
Also, keep in mind that the RAM splits should stay in powers of 2. Just like any images you use in the theme. 2, 4, 8, 16, 32, 64, 128, 256, 512, 1024, 2048, 4096... Your 1x343 image uses the same RAM a 512x512 image would take, as does the 350x350 image. They all unfold to a power of 2 in VRAM.
I hope this helps to understand things a bit better.
When using riot, if just adjust the slider you can see the final size before saving on top of right image, where you can read "optimized image". That's what I do.