Remove animation from progress component

Is there a way to remove the loading animation from the progress component in Perspective? The progress bar always starts of at 50% and once it moves onto the screen the bar moves to the percentage it is actually supposed to represent.

What's the "persistence" setting on the props.value? If it's set to non-persistent then it defaults to 50 before it then loads the bound value. Although any setting will default it to something that most likely won't be your actual value. I'm not really sure how you would fix this... I think ideally you'd want it to start from 0

The persistence setting was False, I now changed it to True. It is indeed better to start from 0 than from 50%, so I am partially satisfied with this solution. I think it is quite strange that the default is to have an animation, we would be happy with just a static progress bar that sets a value when the page is loaded. Could you perhaps explain what the function of the persistence setting is in this case?

You may be able to override the animation CSS using the advanced stylesheet, but there's always a small[1] delay between when the component first loads and when it updates to the bound value from the gateway so the only thing that will change is that the bar will "pop" from 0 to the right value instead of having a smooth animation.

The persistence setting just lets you specify a default value instead of using the preprogrammed default. If you set the value to 99 in the designer and turned on persistence the bar would start at 99 whenever it loaded.


  1. or not so small ↩︎