How to create progress bar percent animation

[Roya_Dimanod]

So there is the deal,here is my inventory widget

as you can see I select different item,it show the different value of the orange bar.

here is how I done with the orange bar.

I thought I can use timeline to do this,but it cant.
can someone tell me how to animate the orange progressbar percent ?
(the orange bar will increase or decrease when select different item)

[eXi (Cedric Neukirchen)]

So you want it to use the old value, of the previous item, and then “move” from there to the new value?

[DamirH]

Unfortunately there is no “easy” way to do this as UMG animations require fixed values in their animations. What you can do is the following:

1. Have a CurrentValue float, a TargetValue float and a AdjustSpeed float.
2. Whenever you modify the value, modify the TargetValue
3. In your widget’s Tick event, first check if the CurrentValue and TargetValue are different (use NearlyEqual when comparing floats)
4. If they are, interpolate the CurrentValue toward the TargetValue (Use InterpTo or InterpToConst). Use the AdjustSpeed as the Speed input.
5. Set the new value to your progress bar’s value

You can optimize this a bit by enabling the tick on your widget when the value changes and disabling it when it reaches the target. This approach has the advantage that even if the value changes mid-transition it will still work correctly.

[Roya_Dimanod]

just what exactly is InterpTo? How can this help me with my animation?

I thought it will run percent 0 to target value smoothly,but it just jump to the target value

InterpTo didnt work,nither does InterpToconst

[Pintotto]

It’s an old question, but I found this solution works as well (using bindings):