Processing feedback

[Thiago Renan Gomes]

Hello,

I would like help implementing a processing tracking so that the user is not looking at a frozen screen while Datagrid is performing lengthy processing like groupings and filters in millions of records.

[Farjana Parveen Ayubb]

Hi Thiago, 

 

Thank you for using Syncfusion controls. 

 

SfDataGrid have a BusyIndicator support. If you enable the ShowBusyIndicator property for SfDataGrid, user can get the notification when processing the grouping and filtering with millions of records. 

 

<syncfusion:SfDataGrid x:Name="dataGrid"  

                       ShowBusyIndicator="True" 

                       AllowFiltering="True"                

                       ShowGroupDropArea="True"  

                       ItemsSource="{Binding Orders}"/> 

 

 

 

 

Please let us know if you need any further details on this. 

 

Regards, 

Farjana Parveen A 

[Thiago Renan Gomes]

Thanks for the reply, 

I would like to know if I can customize this BusyIndicator. It would be possible ?

[Farjana Parveen Ayubb]

Hi Thiago, 

Thank you for your update. 

You can able to customize the BusyIndicator by edit the control template for SfDataGrid, please refer the below code example 

<Style TargetType="{x:Type syncfusion:SfDataGrid}"> 

            <Setter Property="RowDragDropTemplate"> 

                <Setter.Value> 

                    <DataTemplate> 

                        <Border x:Name="border" BorderBrush="#FFC8C8C8" BorderThickness="1.2" Background="#FFECECEC" Height="60" Width="205"> 

                            <Grid HorizontalAlignment="Left" VerticalAlignment="Center"> 

                                <Grid.ColumnDefinitions> 

                                    <ColumnDefinition Width="Auto"/> 

                                    <ColumnDefinition Width="Auto"/> 

                                </Grid.ColumnDefinitions> 

                                <Grid.RowDefinitions> 

                                    <RowDefinition Height="Auto"/> 

                                    <RowDefinition Height="Auto"/> 

                                    <RowDefinition Height="Auto"/> 

                                </Grid.RowDefinitions> 

                                <TextBlock Foreground="#FF333333" FontWeight="Normal" FontSize="14" FontFamily="Segoe UI" Padding="12,0,0,0" Text="{Binding}"><Run Text="Dragging rows count : "/></TextBlock> 

                                <TextBlock Grid.Column="1" Foreground="#FF333333" FontWeight="Normal" FontSize="14" FontFamily="Segoe UI" Margin="-100,0,0,0" Text="{Binding DraggingRecords.Count}"/> 

                                <Separator BorderBrush="#FFC8C8C8" BorderThickness="1" HorizontalAlignment="Stretch" Height="2" Grid.Row="1" VerticalAlignment="Stretch" Width="250"/> 

                                <TextBlock Foreground="#FF333333" FontWeight="Normal" FontSize="14" FontFamily="Segoe UI" Padding="12,0,0,0" Grid.Row="2" Text="{Binding}"><Run Text="Drop status : "/></TextBlock> 

                                <TextBlock Grid.Column="1" Foreground="#FF333333" FontWeight="Normal" FontSize="14" FontFamily="Segoe UI" Margin="-158,0,0,0" Grid.Row="2" Text="{Binding DragStatus}"/> 

                            </Grid> 

                        </Border> 

                    </DataTemplate> 

                </Setter.Value> 

            </Setter> 

            <Setter Property="Background" Value="Transparent"/> 

            <Setter Property="BorderBrush" Value="Gray"/> 

            <Setter Property="BorderThickness" Value="1"/> 

            <Setter Property="FontSize" Value="12"/> 

            <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/> 

            <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/> 

            <Setter Property="ScrollViewer.PanningMode" Value="Both"/> 

            <Setter Property="ScrollViewer.PanningRatio" Value="1"/> 

            <Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False"/> 

            <Setter Property="Template"> 

                <Setter.Value> 

                    <ControlTemplate TargetType="{x:Type syncfusion:SfDataGrid}"> 

                        <Grid SnapsToDevicePixels="True"> 

                            <Grid.RowDefinitions> 

                                <RowDefinition Height="Auto"/> 

                                <RowDefinition Height="*"/> 

                            </Grid.RowDefinitions> 

                            <VisualStateManager.VisualStateGroups> 

                                <VisualStateGroup x:Name="CommonStates"> 

                                    <VisualState x:Name="Normal"/> 

                                    <VisualState x:Name="Busy"> 

                                        <Storyboard> 

                                            <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="IsBusyIndicatorShowing" Storyboard.TargetName="PART_BusyDecorator"> 

                                                <DiscreteBooleanKeyFrame KeyTime="0" Value="True"/> 

                                            </BooleanAnimationUsingKeyFrames> 

                                        </Storyboard> 

                                    </VisualState> 

                                </VisualStateGroup> 

                            </VisualStateManager.VisualStateGroups> 

                            <Border Grid.Row="0" SnapsToDevicePixels="True"> 

                                <Border.Visibility> 

                                    <Binding Path="ShowGroupDropArea" RelativeSource="{RelativeSource TemplatedParent}"> 

                                        <Binding.Converter> 

                                            <syncfusion:BoolToVisiblityConverter/> 

                                        </Binding.Converter> 

                                    </Binding> 

                                </Border.Visibility> 

                                <syncfusion:GroupDropArea x:Name="PART_GroupDropArea" SnapsToDevicePixels="True"/> 

                            </Border> 

                            <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Grid.Row="1" SnapsToDevicePixels="True"> 

                                <ScrollViewer x:Name="PART_ScrollViewer" CanContentScroll="True" FlowDirection="{TemplateBinding FlowDirection}" HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" IsTabStop="False" IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" PanningMode="{TemplateBinding ScrollViewer.PanningMode}" PanningRatio="{TemplateBinding ScrollViewer.PanningRatio}" VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"> 

                                    <syncfusion:VisualContainer x:Name="PART_VisualContainer" AllowFixedGroupCaptions="False" Background="Transparent" CanHorizontallyScroll="True" ColumnCount="0" CanVerticallyScroll="True" FrozenRows="0" FrozenColumns="0" FooterColumns="0" FooterRows="0" HorizontalPixelScroll="True" HorizontalPadding="0" RowsGenerator="{x:Null}" RowCount="0" ScrollOwner="{x:Null}" ScrollableOwner="{x:Null}" VerticalPixelScroll="True" VerticalPadding="0"> 

                                        <syncfusion:VisualContainer.RowHeightManager> 

                                            <syncfusion:RowHeightManager/> 

                                        </syncfusion:VisualContainer.RowHeightManager> 

                                       

                                    </syncfusion:VisualContainer> 

                                </ScrollViewer> 

                            </Border> 

                            <local:BusyIndicator x:Name="PART_BusyDecorator" 

                             Margin="5" 

                            VerticalAlignment="Center" 

                            AnimationType="Gear"/> 

                        </Grid> 

                    </ControlTemplate> 

                </Setter.Value> 

            </Setter> 

        </Style> 

 

public class BusyIndicator : SfBusyIndicator 

{ 

    public bool IsBusyIndicatorShowing 

    { 

        get { return (bool)GetValue(IsBusyIndicatorShowingProperty); } 

        set { SetValue(IsBusyIndicatorShowingProperty, value); } 

    } 

 

    public static readonly DependencyProperty IsBusyIndicatorShowingProperty = DependencyProperty.Register( 

        "IsBusyIndicatorShowing", 

        typeof(bool), 

        typeof(BusyIndicator), 

        new FrameworkPropertyMetadata(false, 

            FrameworkPropertyMetadataOptions.AffectsMeasure, OnIsBusyIndicatorShowingProeprtyChanged)); 

 

    private static void OnIsBusyIndicatorShowingProeprtyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e) 

    { 

        var container = (BusyIndicator)d; 

        if ((bool)e.NewValue) 

        { 

            container.IsBusy = true; 

        } 

        else 

        { 

            container.IsBusy = false; 

        } 

    } 

} 

Sample Location: https://www.syncfusion.com/downloads/support/forum/146737/ze/BusyIndicator804387475 

Please let us know if you need any further details on this. 

Regards, 

Farjana Parveen A