Hi all,
I have created a progress bar within a gallery via a variation of the method listed here. However, instead of a slider, I utilize my underlying data in order to get the rectangle values. There are two rectangles: denoted "goal" and "dynamic". Attached below are their parameters.
Goal:
X : 61
Y: 60
Width: 256
Height: 38
Fill:
If(
(ThisItem.TotalPlanMin / (435 * OperatorRec.Selected.Value)) >= 0 && (ThisItem.TotalPlanMin / (435 * OperatorRec.Selected.Value)) <= 0.50, RGBA(48, 234, 20, 1),
(ThisItem.TotalPlanMin / (435 * OperatorRec.Selected.Value)) > 0.50 && (ThisItem.TotalPlanMin / (435 * OperatorRec.Selected.Value)) <= 0.75, RGBA(242, 246, 13, 1),
(ThisItem.TotalPlanMin / (435 * OperatorRec.Selected.Value)) > 0.75 && (ThisItem.TotalPlanMin / (435 * OperatorRec.Selected.Value)) <= 1.0, RGBA(172, 16, 16, 1),(ThisItem.TotalPlanMin / (435 * OperatorRec.Selected.Value)) > 1.0, ColorFade(RGBA(172, 16, 16, 1), -0.25),
Black
)
Dynamic:
X : 'OrderProgress Goal'.X + 256 - 'OrderProgress Dynamic'.Width
Y: 60
Width:
If(
ThisItem.TotalPlanMin <= (435 * OperatorRec.Selected.Value),
(1 - (ThisItem.TotalPlanMin / (435 * OperatorRec.Selected.Value))) * 'OrderProgress Goal'.Width,
0)
Height: 38
Fill: RGBA(255, 255, 255, 1)
The progress bars fill as a result of that item's "total planned build minutes" divided by the total capacity of the number of operators at that specific item (workstation). However, when I add new data into the source and refresh the set, I get this weird glitch in my progress bars:
As you can see, some of the bars are elongated (S030, for example) and some of the fill values are not corrected added to the bar (S120, for example).
When I change the operator value, it updates and fixes itself like nothing was wrong, but upon adding data or upon app start, a few of them are usually messed up. I have tried to drop and recreate these bars, but to no avail. Anybody know what the issue may be or if there is something similar I can use in this scenario that won't have this bug?
Thanks,
Farhan
Just in case this is something you'd be interested in, here's how to do a gradient for the progress bar color
//Replace Slider.Value with your percentage
If(Slider.Value < 50,
RGBA(255,2 * Slider.Value / 100 * 255,0,1),
RGBA(2 * (100 - Slider.Value) / 100 * 255,255,0,1)
)
@Anonymous,
I plugged in my own values and criteria into your formula and it seemed to work! It looks like I was using the inverse of your formula, manipulating the second rectangle shift over which added some unnecessary complexity and is probably the reason yours works and mine doesn't. Thanks for taking the time to look at this.
Cheers,
Farhan
I think I've got this working as you expect. Here's what I did
Rectangle 1 is just a white rectangle (this is the background rectangle).
Rectangle 2 has the same X and Y as rectangle 1 (in front of rectangle 1)
Rectangle 2 Width property equals
//Min function ensures the width will stop at 100%
Min((Value(actual_tbox.Text) / Value(goal_tbox.Text)) * goalRectangle.Width, goalRectangle.Width)
Where goal_tbox.Text and actual_tbox.Text would be your goal or actual fields
Rectangle 2's Fill property is set to
If(
(Value(actual_tbox.Text) / Value(goal_tbox.Text)) >= 0.00 && (Value(actual_tbox.Text) / Value(goal_tbox.Text)) <= 0.50, Red,
If((Value(actual_tbox.Text) / Value(goal_tbox.Text)) > 0.50 && (Value(actual_tbox.Text) / Value(goal_tbox.Text)) <= 0.75, Yellow,
If((Value(actual_tbox.Text) / Value(goal_tbox.Text)) > 0.75, Green
)))
I've also got a label set to
Text((Value(actual_tbox.Text) / Value(goal_tbox.Text)) * 100, "[$-en-US]#,###.0%")
@Anonymous ,
Thank you! If it helps, here is the underlying table:
This is what "ThisItem.TotalPlanMin" is coming from in the rectangle parameters. The "OperatorRec" syntax is coming from the dropdown in the gallery.
Also accidentally accepted your reply as a solution, lol.
Okay, just wanted to make sure before I looked through your code. Nothing is immediately jumping out at me. I'll keep looking though.
@Anonymous ,
No, these are the standard rectangle shapes built within PowerApps.
Is this using custom components? If so, there is a known issue with PowerApps components going on. Microsoft is looking into it. You can keep track of the status of this error here
WarrenBelz
791
Most Valuable Professional
MS.Ragavendar
410
Super User 2025 Season 2
mmbr1606
275
Super User 2025 Season 2