I have a label (or any other component) on which I’m binding the background color to an expression. The expression is darker(color(255,255,0)). Once I apply the binding, the following is shown as the value: java.awt.Color[r=178,g=178,b=0].
The issue is that the binding doesn’t affect the color at all, even though the little color swatch next to the property shows the proper color returned by the expression binding. Whatever color the label was without the binding, is the color shown on the label. Essentially, it appears that the binding is ignored. Is there something I’m doing wrong?
If you check in the expression binding preview you’ll see that darker(color(255, 255, 0))
is returning color(178, 178, 0, 255)
whereas CSS is expecting rgb(178, 178, 0, 255).
Using replace(darker(color(255, 255, 0)), "color", "rgb")
seems to fix the problem. Is the color() function intended for Vision rather than Perspective?
Excellent solution! Your first suggestion actually works better for my current need though. I’m actually not using a label as I stated in the post. It’s actually the stopColor property on the gradient of a SVG I built (seemed too complicated to explain in the forum). The stopColor is a property of the style for one of the fill/paint stops. I’m not sure if a style can be applied to a style.?
I like your second solution better for almost every other place where the brightness needs to be adjusted.
Without reduced brightness:
With reduced brightness :
I think the reduced brightness gives it more depth.
Figure 1. Both indicators are using the same backgroundImage settings but the one on the right is using the brightness filter.
The filter brightness setting doesn’t seem to have any difficulty in dealing with a radial gradient. I’m using radial-gradient(farthest-corner at 20% 20%, #00ee00, #007700)
The bezel and indicator in my examples are both created with labels. I’ll have to look into the SVG control a bit more.