BlazorSpinner is a loading spinner that can be included in Blazor applications. It has a simple service that can be called to "show" or "hide" the spinner.
Demo link: https://red-bay-06d0ccf10.1.azurestaticapps.net
This is a screen shot of the spinner
- Install the library from Nuget: https://www.nuget.org/packages/BlazorSpinner/
- Add "
@using BlazorSpinner
" in your _Imports.razor - Add "
builder.Services.AddScoped<SpinnerService>();
" in your Program.cs file - Add "
<Spinner></Spinner>
" to your MainLayout.razor file - On any page you want to call the spinner from, inject the SpinnerService into it:
@inject BlazorSpinner.SpinnerService _spinnerService
(NOTE: You can also do this in other service to, just inject it via the constructor) - Call
_spinnerService.Show()
or_spinnerService.Hide()
to "Show" or "Hide" the spinner.
Call the spinner on any long-running calls or processes (such as API calls).
BlazorSpinner uses an icon (https://fontawesome.com/icons/circle-notch?style=solid) from FontAwesome. SVG is directly embedded in this library. Height, Width, Color are modified. For more details, please refer to the license at FontAwesome: https://fontawesome.com/license