How to avoid displaying Horizontal/Vertical scrollbar over the DataGrid cells

[MohanramAnbukkarasu]

I’m working with the WinUI DataGrid from the NuGet package “CommunityToolkit.WinUI.UI.Controls.DataGrid”. The vertical and horizontal scrollbars of the DataGrid are displayed over the cells in the DataGrid. There is no separate space for the scrollbars. The scrollbars occur when hovering on the scrollbar region and hide again when moving the cursor away. The problem is with the Horizontal scrollbar. I must wait for the scrollbar (nearly 3 seconds) to go away to see my last row of data.

I have tried to use the default template of the ScrollViewer to avoid this behavior by removing the RowSpan and ColumnSpan in the default template, but with no success. I have got the default template of the ScrollViewer from the below mentioned file.

https://github.com/microsoft/microsoft-ui-xaml/blob/333b370ccc90a3ee7a1b7d38750a727f1e587602/dev/CommonStyles/ScrollViewer_themeresources.xaml

Is there any way to get rid of this behavior and avoid displaying the scrollbars over the records? Please share your suggestion on this.

Thanks in advance.

[StephenLPeters]

@RBrid and @michael-hawker FYI

[StephenLPeters]

Moving to the WCT repo

[StephenLPeters]

Actually looks like I don't have the ability to do that. @michael-hawker

[michael-hawker]

@StephenLPeters yeah, would be nice to figure out if there's a way we can enable that. May be a limitation of GitHub because we're in different organizations.

@MohanramAnbukkarasu I'm not sure if I completely follow the scenario. Is this behavior unique to the WinUI 3 version of the DataGrid or do you see the sample behavior in our sample app for UWP. If you can reproduce the issue within our sample app, then that can help us better debug and understand. Any video/visuals you could provide to describe the scenario in an issue at https://aka.ms/windowstoolkit would be much appreciated. Thanks!

[RBrid]

@MohanramAnbukkarasu, I can't look into this now, but be aware that the DataGrid does not use the ScrollViewer control at all. It just uses two ScrollBar controls. Have a look at the DataGrid source code, I think it has code that allows it to handle the cases where the ScrollBar overlaps the cell and where it does not, according to the control's XAML template.

[MohanramAnbukkarasu]

@RBrid and @michael-hawker ,

Thanks for your reply.

The sample I have used to check this case is available in this link. DataGrid_Demo.zip

We have created a custom control using ScrollViewer and we need to get rid of this behavior. We found that the same behavior exists in DataGrid also. So, we have raised this query. Please share your suggestion to about the behavior in ScrollViewer

[MohanramAnbukkarasu]

Is there any update for this?

[MohanramAnbukkarasu]

Is there any update for this?

[PMoffitt05]

Try adding padding to the right and bottom of the Grid Control something on the order of about 15 should do. (in XAML, add Padding="0,0,15,15" but your values may vary.)
Just ran into this myself and that was my fix. (I wonder if Margin would be better?)