Articles in this section
Category / Section

How to scroll WPF DataGrid (SfDataGrid) when load with in the ScrollViewer?

1 min read

You can load the WPF DataGrid (SfDataGrid) into the ScrollViewer. But you can’t be able to scroll the WPF DataGrid (SfSDataGrid) through mouse wheel, where you can overcome this by using ScrollViewer.ScrollToVerticalOffset method in SfDataGrid.PreviewMouseWheel event.

XAML

<ScrollViewer x:Name="scrollviewer">
        <StackPanel>
            <Grid x:Name="LayoutRoot" Background="White">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <syncfusion:SfDataGrid Name="SfdataGrid"
                                       Grid.Row="0"
                                       Grid.Column="0"
                                       AllowEditing="True"
                                       AllowSorting="True"
                                       AutoGenerateColumns="False"
                                       ColumnSizer="None"
                                       ItemsSource="{Binding EmployeeDetails}"
                                       NavigationMode="Cell">
                    <syncfusion:SfDataGrid.Columns>
                        <syncfusion:GridTextColumn MappingName="EmployeeName" />
                        <syncfusion:GridTextColumn MappingName="EmployeeArea" />
                        <syncfusion:GridTextColumn MappingName="EmployeeGender" />
                        <syncfusion:GridDateTimeColumn MappingName="EmployeeDate" />
                        <syncfusion:GridNumericColumn MappingName="EmployeeAge" />
                    </syncfusion:SfDataGrid.Columns>
                </syncfusion:SfDataGrid>
 
                <syncfusion:SfDataGrid Name="SfdataGrid2"
                                       Grid.Row="1"
                                       Grid.Column="0"
                                       AllowEditing="True"
                                       AllowResizingColumns="True"
                                       AllowSorting="True"
                                       AutoGenerateColumns="False"
                                       ColumnSizer="None"
                                       ItemsSource="{Binding EmployeeDetails}"
                                       NavigationMode="Cell"
                                       SortClickAction="SingleClick">
                    <syncfusion:SfDataGrid.Columns>
                        <syncfusion:GridTextColumn MappingName="EmployeeName" />
                        <syncfusion:GridTextColumn MappingName="EmployeeArea" />
                        <syncfusion:GridTextColumn MappingName="EmployeeGender" />
                        <syncfusion:GridDateTimeColumn MappingName="EmployeeDate" />
                        <syncfusion:GridNumericColumn MappingName="EmployeeAge" />
                    </syncfusion:SfDataGrid.Columns>
                </syncfusion:SfDataGrid>
            </Grid>
        </StackPanel>
    </ScrollViewer>

 

C#

 
this.SfdataGrid.PreviewMouseWheel += SfdataGrid_PreviewMouseWheel;
this.SfdataGrid2.PreviewMouseWheel += SfdataGrid2_PreviewMouseWheel;
 
void SfdataGrid2_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
    scrollviewer.ScrollToVerticalOffset(scrollviewer.VerticalOffset - e.Delta / 3);
}
 
void SfdataGrid_PreviewMouseWheel(object sender, MouseWheelEventArgs e)
{
    scrollviewer.ScrollToVerticalOffset(scrollviewer.VerticalOffset - e.Delta / 3);
}

View sample in GitHub.

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (1)
Please  to leave a comment
AR
Ariel

Hi

Is there a way to scroll using arrow keys?

Thanks

JG
Jai Ganesh S

Hi Ariel,

 

We have addressed your comment for this KB article in the below Forum,

 

https://www.syncfusion.com/forums/136890/how-to-scroll-the-sfdatagrid-when-we-load-within-scrollviewer-using-arrow-keys

 

Could you please check the above forum and let us know if you need further assistance on this ?

 

Regards,

Jai Ganesh S
Access denied
Access denied