Progress button zoom-out effect stops working forever after calling StopProgress()

Hello,

I have an issue with the Progress Button component. It works as expected, except if I call manually call its StopProgress() method. After I call StopProgress(), the button still works, but the zoom-out effect stops working.

If a Duration is specified for the button, and the button is clicked, the button's zoom-out effect works as expected: the animation plays, the progress advances until the completion, and then the zoom-out effect works fine when clicked again.

However, if I call StopProgress() while it's progressing to stop the animation, the zoom-out effect won't work again until I reload the page.

For example, this button has a duration of 3000ms:

<SfProgressButton @ref="@ProgressButton" @onclick="Clicked" Content="Send" EnableProgress="true" Duration="3000" CssClass="e-small e-danger">

    <ProgressButtonSpinSettings Position="SpinPosition.Center" />
    <ProgressButtonAnimationSettings Effect="Syncfusion.Blazor.SplitButtons.AnimationEffect.ZoomOut" />

</SfProgressButton>

And my C# code, which calls ProgressComplete() after 500ms:

private async Task Clicked(Microsoft.AspNetCore.Components.Web.MouseEventArgs args)
        {
            await Task.Delay(500);

            await ProgressButton.ProgressComplete();
        }

This will cause the zoom-out animation to never work again until the page is reloaded.


1 Reply 1 reply marked as answer

GK Gayathri KarunaiAnandam Syncfusion Team April 27, 2021 04:52 PM UTC

Hi Gonzalo, 

We have checked your reported query. We would like to let you know that ProgressComplete method is used to complete progress indication. Stop method stops only the progress when EnableProgress property is set to true. We are unable to reproduce the reported issue in our end. Please refer below code snippets. 

Code Snippet: 

@using Syncfusion.Blazor.SplitButtons 
 
<SfProgressButton @ref="@ProgressButton" @onclick="Clicked" Content="Send" EnableProgress="true" Duration="3000" CssClass="e-small e-danger"> 
 
    <ProgressButtonSpinSettings Position="SpinPosition.Center" /> 
    <ProgressButtonAnimationSettings Effect="Syncfusion.Blazor.SplitButtons.AnimationEffect.ZoomOut" /> 
 
</SfProgressButton> 
 
@code { 
    SfProgressButton ProgressButton; 
    private async Task Clicked(Microsoft.AspNetCore.Components.Web.MouseEventArgs args) 
    { 
        await Task.Delay(500); 
 
        await ProgressButton.ProgressComplete(); 
    } 
 
} 

For your reference, we have prepared a sample based on your code. 


If we misunderstand your requirement, kindly share the below details. 
  • If possible, try to reproduce the reported issue in provided sample or share the issue reproducible sample
  • If possible, please share the video of the issue.
  • Please share the Syncfusion version you are using.

Please provide the above requested information, based on that we will check and provide you a better solution quickly. 

Regards, 
Gayathri K 


Marked as answer
Loader.
Up arrow icon