Animation in Blazor ProgressBar Component

4 Aug 20211 minute to read

The progress bar supports animation, which can be enabled by setting the Enable property to true in the ProgressBarAnimation. The speed and the delay during an animation can be controlled using the Duration and the Delay properties.

@using Syncfusion.Blazor.ProgressBar

<SfProgressBar Type="ProgressType.Linear" Value="90" Height="60" Width="90%" TrackColor="#FFFFFF"
               ShowProgressValue="true" ProgressColor="#2BB20E" TrackThickness="24" CornerRadius="CornerType.Round"
               ProgressThickness="24" Minimum="0" Maximum="100">
    <ProgressBarAnimation Enable="true" Duration="2000" Delay="0"></ProgressBarAnimation>
</SfProgressBar>

Progress Bar with Animation