Skip to main content
All docs
V24.2

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DxProgressBar.Visible Property

Specifies the progress bar visibility.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
[DefaultValue(true)]
[Parameter]
public bool Visible { get; set; }

#Property Value

Type Default Description
Boolean true

true to show the progress bar; otherwise, false.

#Remarks

Set the Visible property to false to hide the progress bar.

razor
<DxButton Text="Show a notification" Click="ShowToast" />
<DxToastProvider ThemeMode="ToastThemeMode.Pastel" />

<DxToast @ref=toast 
    Text="The process is completed." 
    DisplayTime="@TimeSpan.FromSeconds(0)" 
    FreezeOnClick="true" 
    Click="HideProgressBar">
    <Template>
        <DxProgressBar @ref=bar 
            Value="value" 
            ShowLabel="false" 
            ProgressCompleted="CloseToast" />
    </Template>
</DxToast>

@code {
    DxProgressBar bar;
    DxToast toast;
    int value;
    bool running;

    private void ShowToast() {
        value = 0;
        toast.Show();
        RunProgress();
    }

    private void RunProgress() {
        if (running) return;
        running = true;
        InvokeAsync(async () => {
            while (running && value < 100) {
                value++;
                await Task.Delay(30);
                StateHasChanged();
            }
            running = false;
        });
    }

    private void HideProgressBar() {
        bar.Visible = false;
        running = false;
        StateHasChanged();
    }

    private void CloseToast() {
        toast.Close();
    }
}
See Also