In a new module I’m developing, I have a VCVLightBezelLatch, and it works great as a push-button control that lights up when “on” and goes dark when “off”.
I have received feedback from pre-release testers that it would be helpful to superimpose the international power on/off symbol “⏻” on the button. After looking at the code for VCVLightBezelLatch, I came up with my own version that looks like this:
My file res/power.svg is just like the file res/ComponentLibrary/VCVBezel.svg that comes with VCV Rack, only I added the aforementioned ⏻ Unicode character converted to an SVG path, centered on the button.
Anyway, it looks fine when the button is off. But when the button is on (the light is lit), the power symbol gets washed out. As you can see in the code above, I tried making the light’s base color semi-transparent: light->addBaseColor(nvgRGBA(0xff, 0xff, 0xff, 0xc0)); I end up with a dilemma: either it’s too transparent (alpha much lower than 0xc0), and the light is hard to see, or it’s not transparent enough and the power symbol becomes hard to see.
One idea I have now is to draw the “⏻” on top of everything else somehow. But I have no clue how to do that. So my overall question is, what is the best way to show the power symbol on top of the button whether or not the light is turned on? My secondary question is, if the idea of drawing the character/path myself on top of the button and light will work, how do I do that? Just a pointer to any existing code I can look at would be great.
I implemented something sort of like this, except in my case the buttons are stenciled black so that the button’s symbol (such as ⏻) is emitting light rather than blocking it.
It’s been a while so I’m fuzzy on the details, but the gist is that I created an SvgLight subclass of rack::SvgWidget which draws its SVG on Layer 1 instead of Layer 0. Then I subclassed rack::SvgSwitch as SvgLightSwitch which holds an SvgLight inside.
You can find some example code here, as it stands in the stable version of Algomorph. Excuse the unused stuff for drawing an SVG halo.