Is it possible to set a multicolor progress bar to different colors based on battery %?

General
1

I'm trying to get the progress bar to display different colors based around how much battery charge is left. For example, 100% displays a green, 99 to 80% on the bar displays a different color, etc. I think it's possible, but the exact code to do so eludes me.

2

Yeah sure, this should be quite easy, just do the following:

  • Open the Advanced Editor and Create a Progress Bar
  • Go in the "Color" section, set "Mode" to "Gradient"
  • Select the "FgColor" option and then press the calculator icon on top, select it to make this preference a formula
  • Do the same for the "GrColor" option
  • Now both preferences have been switched to a "Formula" preference so it's now controlled by an expression rather than a simple value, click the preference to edit the Formula
  • Type $if(bi(charging) = 0, #FFFF00, #00FF00)$ and press the "ok" button on top right for the FgColor
  • Type #000000 for the GrColor
  • Done! Your shape gradient will go from #FFFF00 to #000000 when battery is discharging and #00FF00 to #000000 otherwise

You can use more complex formulas like:

$if(bi(level) > 90, #00FF00, bi(level) > 70, #22AA00, bi(level) > 50, #999900, #FF4400)$

This will show green if level greater than 90, a bit more orange (22FF00) when from 70 to 90, orange from 50 to 70 and red otherwise.

Or you can even use a gradient within a grandient, so something like

$ce(#FF0000, #FF0000, bi(level))$

This formula will create a color that goes from full RED to full GREEN based on battery level, so when level is 0 it will be red when level is 100 it will be green, Kustom will take care of calculating the values.

3

Frank, thanks for this detailed answer.

I opted for the 3rd Option: $ce(#FF000 _ _ _)

Do I put this formula in Fgcolor, bgcolor and grcolor

4

Hi, sorry I know this is an old post, but I'm new to kwgt and klwp, and reddit tbh. But you seem very knowledgeable about this kind of stuff. I've attached an image of what my current setup looks like. The top 2 background striped change hex depending on the time and date accordingly, and I'd like the bottom 2 to reflect battery and weather temperature. Could you help me with that? Like you mentioned in the battery I'd like the whole bar to display green if it's 100% and slowly transition to red at 1% and similar for weather, if it's 100°F or above have it be red and for 0°F have it be blue. Is there a way to do that? Would anyone help, thanks. For the 2 stripes I already have they're just regular shapes with a formula fill that I found online. I know how to make the text appear, it's just the color fill I'm having issues with. Any help is appreciated thanks!