How to display a busy indicator till the SfDataGrid is loading?

1 min read

SfDataGrid takes some time for its initial loading of data and it largely depends on the type and size of the bound data. Thus, you can load an animation in the meantime the grid is loading using a SfBusyIndicator in the SfDataGrid.GridLoaded event.

Refer the below code in which a busy indicator is created and displayed until the SfDataGrid is loaded.

protected override void OnCreate(Bundle bundle)
{
    base.OnCreate(bundle);           
    SetContentView (Resource.Layout.Main);
    viewModel = new ViewModel();
    dataGrid = new SfDataGrid(this);
    busyIndicator = new SfBusyIndicator(this);
    dataGrid.ItemsSource = viewModel.Collection;
    dataGrid.ColumnSizer = ColumnSizer.Star;
    dataGrid.GridLoaded += DataGrid_GridLoaded;
    frameLayout = FindViewById<FrameLayout>(Resource.Id.frameLayout);
    frameLayout.AddView(dataGrid);
}
 
private async void DataGrid_GridLoaded(object sender, GridLoadedEventArgs e)
{
    busyIndicator.IsBusy = true;
    busyIndicator.ViewBoxHeight = 100;
    busyIndicator.ViewBoxWidth = 100;
    busyIndicator.AnimationType = AnimationTypes.SingleCircle;
    busyIndicator.Title = "Loading...";
    busyIndicator.TextSize = 50;
    frameLayout.AddView(busyIndicator);
    await Task.Delay(5000);
    busyIndicator.IsBusy = false;
    busyIndicator.Visibility = Android.Views.ViewStates.Invisible;           
}

When the above code is executed, the output is obtained as follow:

$C:\Users\suhasini.suresh\AppData\Local\Microsoft\Windows\INetCacheContent.Word\BusyIndicatorInGrid.png$