Scrollbar isn't properly synched with the scrolling

[Luffyyy]

Describe the bug
The scrolling on the datagrid is a bit weird, it's like not taking in account some items in the calculation so the scrollbar isn't fully representing the scrolling state. I checked it with the regular fluent theme and it doesn't have the same issue.
It happens with both manually holding the scrollbar and also scrolling with mousewheel.

To Reproduce
Steps to reproduce the behavior:

1. Make a datagrid and limit its height.
2. Populate it with enough items.

Expected behavior
The scrollbar properly represents the scrolling of the view.

Screenshots

shadui-app_LtNEXQGjHU.mp4

Desktop (please complete the following information):

• OS: Windows 11
• Version: 24H2

[lucasshiva]

It seems to be an issue with ShadUI's DataGrid template. Another thing I've noticed is scroll position resetting on page navigation with cached views. After digging around, I've noticed that both Fluent and SukiUI use a ScrollBar inside the grid, while ShadUI uses a ScrollViewer instead.

Overriding the DataGrid template to use a ScrollBar fixed both issues for me. I even went ahead and added support for horizontal scrollbars as well. The only problem is that ShadUI doesn't add a theme for Scrollbar (only for ScrollViewer), so we still need to add that later.

This is the style override I used:

<Application.Styles>
    <shadUi:ShadTheme />

    <!--
        Improve ShadUI's DataGrid. This modifies the following:
        1. Use a ScrollBar instead of a ScrollViewer, making scroll persist on cached navigation.
        2. Add a horizontal scrollbar.
        
        Note: we might also want to add a ScrollBar style since ShadUI doesn't have one.
    -->
    <Style Selector="DataGrid">
        <Setter Property="Template">
            <ControlTemplate>
                <Border
                    x:Name="DataGridBorder"
                    Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    ClipToBounds="True"
                    CornerRadius="{TemplateBinding CornerRadius}">
                    <Border ClipToBounds="True" CornerRadius="{TemplateBinding CornerRadius}">
                        <Grid
                            x:Name="Grid"
                            ClipToBounds="True"
                            ColumnDefinitions="*, Auto"
                            RowDefinitions="Auto,*,Auto">
                            <Border
                                x:Name="PART_HeaderBackground"
                                Grid.Row="0"
                                Grid.Column="0"
                                BorderBrush="{DynamicResource BorderColor}"
                                BorderThickness="0,0,0,1">
                                <DataGridColumnHeadersPresenter Name="PART_ColumnHeadersPresenter" />
                            </Border>

                            <DataGridRowsPresenter Name="PART_RowsPresenter" Grid.Row="1" Grid.Column="0">
                                <DataGridRowsPresenter.GestureRecognizers>
                                    <ScrollGestureRecognizer CanHorizontallyScroll="True" CanVerticallyScroll="True" />
                                </DataGridRowsPresenter.GestureRecognizers>
                            </DataGridRowsPresenter>

                            <ScrollBar
                                Name="PART_VerticalScrollbar"
                                Grid.Row="1"
                                Grid.Column="1"
                                HorizontalAlignment="Right"
                                Orientation="Vertical" />

                            <ScrollBar
                                Name="PART_HorizontalScrollbar"
                                Grid.Row="2"
                                Grid.Column="0"
                                Orientation="Horizontal" />
                        </Grid>
                    </Border>
                </Border>
            </ControlTemplate>
        </Setter>
    </Style>
</Application.Styles>

[accntech]

Hi @Luffyyy and @lucasshiva

Thanks for the time digging into this issue. Just been busy with other projects lately. I'll make sure to properly look into this. As always, thanks for the interest and support for this project