OverviewHistoryStatsSecurity
npx skills add ...
Documentation
SKILL.md
npx skills add syncfusion/wpf-ui-components-skills --skill syncfusion-wpf-busy-indicator
Comprehensive guide for implementing the Syncfusion WPF Busy Indicator (SfBusyIndicator) control in Windows Presentation Foundation applications. Use this skill when working with loading indicators, progress animations, or visual feedback during async and long-running operations in WPF. Covers IsBusy binding, AnimationType configuration, header customization, MVVM integration, and sizing with ViewboxHeight/ViewboxWidth.
npx skills add syncfusion/wpf-ui-components-skills --skill syncfusion-wpf-busy-indicator
Comprehensive guide for implementing the Syncfusion® WPF Busy Indicator control. The SfBusyIndicator provides visual feedback during long-running operations with over 37 built-in animations, customizable headers, and full MVVM support.
Use this skill when user need to:
The SfBusyIndicator is essential for improving user experience by providing clear visual feedback during operations that require users to wait.
The SfBusyIndicator control provides a flexible and customizable way to display loading indicators in WPF applications:
Syncfusion.SfBusyIndicator.WPFSyncfusion.Windows.Controls.NotificationSyncfusion.SfBusyIndicator.WPF📄 Read: references/getting-started.md
📄 Read: references/animation-types.md
📄 Read: references/isbusy-property.md
📄 Read: references/header-customization.md
📄 Read: references/sizing.md
📄 Read: references/methods.md
| Property | Type | Description |
|---|---|---|
| IsBusy | bool | Controls whether the animation is displayed |
| AnimationType | AnimationTypes | Sets the animation style (Flight, Spin, etc.) |
| AnimationSpeed | double | Controls animation speed (not for Fluent type) |
| Header | object | Text or content displayed below animation |
| HeaderTemplate | DataTemplate | Custom template for header content |
| ViewboxHeight | double | Height of the animation viewbox |
| ViewboxWidth | double | Width of the animation viewbox |
| Method | Description |
|---|---|
| Dispose() | Releases managed and unmanaged resources |
| Dispose(Boolean) | Protected overload for resource cleanup |
| OnApplyTemplate() | Override to access template parts |
| OnAnimationTypeChanged() | Override to handle animation type changes |
| OnPropertyChanged() | Override to monitor property changes |
Display a busy indicator while fetching data from APIs, databases, or file systems. Bind IsBusy to the loading state in your view model.
Show loading feedback during file uploads, downloads, or processing operations with informative headers indicating the current operation.
Indicate that background tasks are running (calculations, image processing, batch operations) with appropriate animation types and messages.
Display a busy indicator during application startup while loading configuration, user settings, or initial data.
Provide visual feedback while performing complex search or filter operations on large datasets.
Show busy indicators when navigating between views or loading page content in navigation-based applications.
Next Steps: Navigate to the reference files above based on your specific implementation needs. Start with getting-started.md for initial setup or jump directly to feature-specific references for advanced scenarios.
<Grid>
<syncfusion:SfBusyIndicator IsBusy="{Binding IsLoading}"
AnimationType="DoubleCircle"
Header="{Binding LoadingMessage}"/>
</Grid>public class MainViewModel : INotifyPropertyChanged
{
private bool _isLoading;
public bool IsLoading
{
get => _isLoading;
set { _isLoading = value; OnPropertyChanged(); }
}
private string _loadingMessage = "Please wait...";
public string LoadingMessage
{
get => _loadingMessage;
set { _loadingMessage = value; OnPropertyChanged(); }
}
public async Task LoadDataAsync()
{
IsLoading = true;
LoadingMessage = "Loading data...";
await Task.Delay(3000); // Simulate operation
IsLoading = false;
}
}public class DataViewModel : ViewModelBase
{
private bool _isBusy;
public bool IsBusy
{
get => _isBusy;
set => SetProperty(ref _isBusy, value);
}
public ICommand LoadCommand { get; }
public DataViewModel()
{
LoadCommand = new RelayCommand(async () => await LoadDataAsync());
}
private async Task LoadDataAsync()
{
IsBusy = true;
try
{
var data = await _dataService.GetDataAsync();
// Process data
}
finally
{
IsBusy = false;
}
}
}<StackPanel>
<ComboBox x:Name="AnimationSelector" SelectedIndex="0">
<ComboBoxItem Content="Flight"/>
<ComboBoxItem Content="DoubleCircle"/>
<ComboBoxItem Content="Spin"/>
</ComboBox>
<syncfusion:SfBusyIndicator IsBusy="True"
AnimationType="{Binding ElementName=AnimationSelector,
Path=SelectedItem.Content}"/>
</StackPanel><Grid>
<!-- Main content -->
<ContentControl Content="{Binding MainContent}"/>
<!-- Overlay busy indicator -->
<Grid Background="#80000000"
Visibility="{Binding IsBusy, Converter={StaticResource BoolToVisibilityConverter}}">
<syncfusion:SfBusyIndicator IsBusy="{Binding IsBusy}"
AnimationType="Ball"
Header="Processing..."
Foreground="White"
ViewboxHeight="150"
ViewboxWidth="150"/>
</Grid>
</Grid><syncfusion:SfBusyIndicator IsBusy="{Binding IsProcessing}">
<syncfusion:SfBusyIndicator.HeaderTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding CurrentOperation}"
FontSize="14" FontWeight="Bold"/>
<TextBlock Text="{Binding ProgressPercentage, StringFormat='Progress: {0}%'}"
FontSize="11" Margin="0,5,0,0"/>
</StackPanel>
</DataTemplate>
</syncfusion:SfBusyIndicator.HeaderTemplate>
</syncfusion:SfBusyIndicator>