Presto layered graphics

Hi,

I’m using the Pico Graphics library to draw a combination of bitmaps and text. Is there a way to clear a layer to be transparent, or to use a transparent brush?

What I’d like to do is draw a bitmap to layer 0 which is relatively static and use layer 1 for more dynamic overlays. And to avoid having to redraw layer 0 just because something in layer 1 changes. I would then just clear the regions of layer 1 that have changed and then draw the new content.

Thanks!

No suggestions? I’d have thought this would be a benefit of the layered graphics feature.

Possible that I’m misunderstanding what you’re trying to do here but yes, you can use layers with Presto as you describe - image_gallery.py for example uses separate layers for the image and UI elements: presto/examples/image_gallery.py at main · pimoroni/presto · GitHub

If you look at the source code, you will see that there is not much code backing the layers. You can basically use two layers and switch between them. But this does not change the basic “canvas” type of graphics architecture. You have two canvases that you can draw on, but that’s about it. There is no layer blending and there is no transparency.

BTW: the displayio-system of CircuitPython has z-layers built in and it automatically takes care of only redrawing things that have changed. There is a nice bouncing-ball example. In the animation, you only need t change the coordinates of the ball (i.e. a circle), and that’s it. The background and whatever other objects you have are redrawn automatically if necessary.

…damn cool!

Apart from the circuitpython world you would need to take care of your copy of a framebuffer to do some kind of animation effect. So basically, you freeze the screen in a framebuffer copy and always redraw the moving object on top of it.

I remember back in the days when I drew windows on GUIs using the XOR function. Before moving the window to a new position, I drew it again on the old position XORing the pixels first and thus restored the old screen underneath again. Haven’t tried in micropython though….

Ah, so a pen with RGB (1,1,1) is transparent. It doesn’t seem documented anywhere. Would be useful! :)

1 Like

Good find!

Please elaborate on how would you use this to go on…

I just understand that you would draw transparent and then…? Are you going to play with layers? How will you see your drawing then, if you dont flip layers? Sorry, I am not getting it… I need more information to follow…

I have a background JPEG being drawn to layer 0, and I draw overlaid dynamic content on layer 1.

Since it’s slow to draw images, I want to avoid redrawing layer 0.

Layer 1 is drawn by different components, each with their own defined rectangle of screen space. Eg. time takes up one part of the screen, weather another. When one of these components updates, it now redraws a transparent rectangle for just its region before drawing its content.

That way I don’t redraw unnecessarily.

…understood - that sounds like a plan. I understand it’s working good out for you.

I will also look into this as I also have a) some partial updates on Presto screen (same as you) and b) full layer pixel movements while drawing and/or moving pop-up windows & messages on Presto. It’s clever to have this kind of temporary drawings layered to easily change or remove again on top of all other things…

I haven’t dealt with it until now, but can you/anybody point my to example code to easily get into this?

Also, how about the memory consumption? Can anybody indicate approximate memory consumption per layer? Does it eat a lot? As I have some internet data to pull, I experience some significant memory consumption anyways, so I am sensitive to the subject…

And finally, what also comes into my mind: Will the layer approach also work on epaper displays (badgers, etc.) and OLEDs or only on LCDs (Presto, Tufty, etc.)?

If I read the code correctly, you only have two layers. And each layer is a framebuffer the size of the Presto screen. Now I am not sure if the graphics system uses double-buffering for each layer, so memory used might be even higher. But take this with a grain of salt, since I did not notice the transparent pixel stuff while going through the code either. The best thing is probably to just try and measure.

yeah, I am monitoring free memory already and apply some fancy GC to clean up memory over and over again…