Overlays on Bangle.js 2

I've been trying to think of a nice way of doing popups (where something goes over the screen, but we can restore the background after it's gone). I now have something that I reckon is pretty flexible:

In cutting edge builds (2v14.125 and later) Bangle.setLCDOverlay(img,x,y); allows you to overlay a transparent image over the top of the screen contents. You can create that image using a Graphics instance if you want to. Apps underneath can keep updating and the overlay is still drawn on top of them.

When you do Bangle.setLCDOverlay(); the overlay is removed and everything keeps being rendered as normal.

For instance if you want homer over your app:

var homer = require("heatshrink").decompress(atob("nFa4kBwH+///vvvx9j4HcgkhwHUoHM8HkgHl0HcombkHE0HUsH+sHUiIAQmYSRAA0TmYABmIaZDgQ7UDQgeEGyQTCHYw2RHZIaOh3u8DdByYyBHIJBFABMQfQ0O8I6BDAI4MDQ4dDDYQ7CDSYAB2ZQCKhQaLDYM7DZY2MDYM9gIbKDRgbCgAbJGxqLBn0AgIbWhszmAEBDZBSNhcz6DHEGyUAhMz8A7CDao7FKSg7G8IbYAALiBKSwb6gBuZDfpuWDYgaWDYY2XDYYaXDe8BN4ciAAIbXDQQcUDYUSDYkgBYMCAogbMDQg4CDQQcNGw4AIDhQbQPBRSIDZsN6BuLKhuznobYhMznY6B2IbRKgfjmczgHTmIbEktSDZwaBmfuAQIbEqtVDZsLDYXTDYbDCDZBAEDYOTme9DoQbFKZAkEgEOCwKMBDYiMLDYsDmc+OIUxAII4EAA5ADYYJqByAbCiIbDiLsDgECb5PTbgIfCDYkQDYkAUxMN6ADB9b5BDYYaFDZQAEC4MTDZJUGKQIbHAAYMGDgoaHDZwcDDREBDYqLGABwcGDahUGiOZAAmYxGJ8A4QDQuZxAABDhgaDjIaIAANJC43t7wbLDQmEomeDYuXvobFNgwaEolIKovXDZQaHolKpwbEs5TFKQYaExAaD1WkRxAbGDQ9E1QAByDDKDYSHGDQlmtLCKNhQaC01mtRUFfQiHKDQYABKggZDAAKHKDQlmtwbJDRRsBAAVv/IbNUQwaDs3/DZMYQ5YaD//9DZAaQ/9/DZSiKNgIaB+4bLQ5W754aBu92N5KHKt/L3gaBu90fRERDRNn5e73YaBu95DZMUQ41n5gZBDYl+DZIABDINvu/MGYQAC3gbCoAbLAAIXEAAXM44bC8AbUDIZuFDZUbDRN3yAbOHAfMDIl35IaEcAwAF///DQo2GDZkXDIt8twaGDZcRo4aEpwaHDZkOztnu3ZzwaIRhcRCpIb/DbKMDA"))
Bangle.setLCDOverlay(homer,24,24);

So hopefully when 2v15 comes out you'll be able to have popup widgets done in a nice way, and it should open the way for a bunch of other stuff too.

Thats pretty neat!

I guess we now want some way to mask events, so we can interact with those popups without messing with the underlying app ;-)

edit: I didn't read the title properly and missed the Bangle.js 2 part.

@Gordon, what about the input controls on active overlay, especially the touch?

missed the Bangle.js 2 part.

Yes, unfortunately it's just not possible on Bangle.js 1 because we have no offscreen buffer. But on that we do at least have the ability to scroll down and display stuff at the top of the screen (which Bangle.js didn't have).

what about the input controls on active overlay, especially the touch?

That is unchanged. It's a bit of a minefield to be honest, but you could write some code to remove input handlers and reinstate them after if needed. Maybe that could be turned into a library that others could use