Fixed DataGrid Column Header issues

[dipeshmsft]

Fixes #8678 , #10400

Description

Since, DataGrid in itself is a very complex control with more than half a dozen subcomponents, hence I have decided to divide the fixing of DataGrid style in parts. In this PR, I have taken a stab at fixing the column header and related components. Next I will try to fix select all and row related components in one go and at last data grid cells and data grid as a whole.

For the complete you can take a look here : Restyled DataGrid Control

Here are some screenshots of how the column header will look after the changes :

Customer Impact

Customers will get a better looking datagrid, where the interaction with datagrid column headers will have the correct visual feedback.

Regression

No

Testing

Local app testing.

Risk

Minimal

Microsoft Reviewers: Open in CodeFlow

[Copilot]

Pull Request Overview

This PR fixes visual issues with the DataGrid column header and its related components by updating the XAML resources and styles used across multiple themes. Key changes include:

• Introducing new resource keys and style definitions for DataGrid column headers and their drop separators.
• Replacing the deprecated DragIndicatorStyle with the DefaultDataGridColumnFloatingHeaderStyle.
• Updating the color and layout settings in theme resource files (Fluent, Fluent.Light, Fluent.HC, Fluent.Dark, etc.) to improve the visual feedback on column header interactions.

Reviewed Changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
Themes/Fluent.xaml	Updated DataGrid header resources and styles, including new resource keys.
Themes/Fluent.Light.xaml	Revised DataGrid header styling with new resource references and replaced DragIndicatorStyle.
Themes/Fluent.HC.xaml	Updated High-Contrast theme resources for DataGrid headers and separators.
Themes/Fluent.Dark.xaml	Modified dark theme DataGrid styles and resource references accordingly.
Styles/DataGrid.xaml	Modified template and resource settings for DataGrid column header styles and drag/drop indicator styles.
Resources/Theme/Light.xaml	Updated brush definitions for DataGrid header backgrounds and borders.
Resources/Theme/HC.xaml	Adjusted HC resources for DataGrid header elements.
Resources/Theme/Dark.xaml	Updated dark theme color resources for DataGrid header components.

Comments suppressed due to low confidence (2)

src/Microsoft.DotNet.Wpf/src/Themes/PresentationFramework.Fluent/Themes/Fluent.xaml:1443

• Ensure that the deprecation comment for 'DefaultDragIndicatorStyleStyle' is clear and that any references to it throughout the codebase are fully updated to use 'DefaultDataGridColumnFloatingHeaderStyle'.

<!-- Deprecated in .NET 10. Replaced with DefaultDataGridColumnFloatingHeaderStyle resource -->

src/Microsoft.DotNet.Wpf/src/Themes/PresentationFramework.Fluent/Styles/DataGrid.xaml:576

• Confirm that changing the DragIndicatorStyle to use DefaultDataGridColumnFloatingHeaderStyle (via the deprecated style replacement) is intentional and that all consuming components are updated accordingly.

<Setter Property="DragIndicatorStyle" Value="{StaticResource DefaultDragIndicatorStyleStyle}" />

[dipeshmsft]

@robert-abeo, I tried ControlFillSecondary/Tertiary color for the header, but the difference in the background of cell and header was very minimal, and it was getting harder to distinguish between them, so I have used SubtleFillColor's here.

As I go ahead with the other parts of the DataGrid, I will try to incorporate those in the style.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 2.98812%. Comparing base (3439f20) to head (6255bc3).
Report is 2 commits behind head on main.

Additional details and impacted files

@@             Coverage Diff             @@
##               main     #10912   +/-   ##
===========================================
  Coverage   2.98812%   2.98812%           
===========================================
  Files          3320       3320           
  Lines        664900     664900           
  Branches      74675      74675           
===========================================
  Hits          19868      19868           
  Misses       644851     644851           
  Partials        181        181           

Flag	Coverage Δ
Debug	2.98812% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

[harshit7962]

(From Ally POV) For the visual feedback of separator in floating styles, the reordering to the first column probably needs more width. Adding a margin to the containing border might help?
Reference Image:

[dipeshmsft]

@harshit7962, I don't think there is much I can do about that. Take a look at Aero2 DataGrid.

Here is a normal example :

And here is the example for the situation you mentioned above :

As you can see very little part of the floating drop indicator is being shown here as well.