[Bug] Cannot Set Column Header Font Size

[scottkuhl]

Describe the bug

If you try to set the DataGrid column header font size it does not work.

• Is this bug a regression in the toolkit? Version 6.1.1

Steps to Reproduce

• Can this be reproduced in the Sample App?

    <controls:DataGrid
      Grid.Row="1"
        x:Name="dataGrid"
        Margin="12"
        VerticalAlignment="Stretch" HorizontalAlignment="Stretch"
        HorizontalScrollBarVisibility="Visible"
        VerticalScrollBarVisibility="Visible"
        AlternatingRowBackground="Transparent"
        AlternatingRowForeground="Gray"
        AreRowDetailsFrozen="False"
        AreRowGroupHeadersFrozen="True"
        AutoGenerateColumns="False"
        CanUserSortColumns="False"
        CanUserReorderColumns="True"
        CanUserResizeColumns="True"
        ColumnHeaderHeight="32"
        MaxColumnWidth="400"
        FontSize="24"
        FrozenColumnCount="0"
        GridLinesVisibility="None"
        HeadersVisibility="Column"
        IsReadOnly="False"
        RowDetailsTemplate="{StaticResource RowDetailsTemplate}"
        RowDetailsVisibilityMode="Collapsed"
        SelectionMode="Extended"
        RowGroupHeaderPropertyNameAlternative="Range">
      <controls:DataGrid.Columns>
        <controls:DataGridTextColumn Header="Rank" Binding="{Binding Rank}" Tag="Rank" />
        <controls:DataGridComboBoxColumn Header="Mountain" Binding="{Binding Mountain}" Tag="Mountain" />
        <controls:DataGridTextColumn Header="Height (m)" Binding="{Binding Height_m}" Tag="Height_m" />
        <controls:DataGridTextColumn Header="Range" Binding="{Binding Range}" Tag="Range" />
        <controls:DataGridTextColumn Header="Parent Mountain" Binding="{Binding Parent_mountain}" Tag="Parent_mountain" />
      </controls:DataGrid.Columns>
    </controls:DataGrid>

Steps to reproduce the behavior:

1. Set the FontSize value on a DataGrid to anything other than 12.
2. Run the app.
3. The DataGrid column header font size will still be 12.

Expected behavior

The font size of the text in the column header should change to match the new value set.

Screenshots

Environment

NuGet Package(s): Microsoft.Toolkit.Uwp.UI.Controls.DataGrid

Package Version(s): 6.1.1

Windows 10 Build Number:

• Fall Creators Update (16299)
• April 2018 Update (17134)
• October 2018 Update (17763)
• May 2019 Update (18362)
• May 2020 Update (19041)
• Insider Build (build number: )

App min and target version:

• Fall Creators Update (16299)
• April 2018 Update (17134)
• October 2018 Update (17763)
• May 2019 Update (18362)
• May 2020 Update (19041)
• Insider Build (xxxxx)

Device form factor:

• Desktop
• Xbox
• Surface Hub
• IoT

Visual Studio

• 2017 (version: )
• 2019 (version: 16.8.3)
• 2019 Preview (version: )

Additional context

@michael-hawker confirmed the issue is on line 506 of https://github.com/windows-toolkit/WindowsCommunityToolkit/blob/master/Microsoft.Toolkit.Uwp.UI.Controls.DataGrid/DataGrid/DataGrid.xaml#L506. The value is hard coded.

Workaround

You'll have to copy the style and override it.

Suggested Fix From Michael Hawker

We should at least name these styles, if not expose this as at least an overridable resource value too.

Hello scottkuhl, thank you for opening an issue with us!

I have automatically added a "needs triage" label to help get things started. Our team will analyze and investigate the issue, and escalate it to the relevant team if possible. Other community members may also look into the issue and provide feedback 🙌

[mdtauk]

Are there any lightweight styles you can override?

[scottkuhl]

I believe FontFamily worked but Font weight also does not seem to work.

[Kyaa-dost]

Thanks, @scottkuhl for the detailed information. Looping in @anawishnoff and @RBrid ⬆️

[anawishnoff]

Thanks for filing this! I agree that this should be overridable and not hard coded. If the FontSize in the DataGridColumnHeader style was bound to a user-input value (with a built-in default), you'd also have to make sure that the sort icon is bound to that FontSize as well.

I think that if the DataGridColumnHeader is customizable, that the DataGridRowGroupHeader should be as well (there would also be icons to update there).

This seems to me like a good candidate for a community contribution, as it's primarily style work and should hopefully only require editing one file rather than sifting through the whole repo. @Kyaa-dost, @michael-hawker let me know if you agree and if we should add a help-wanted badge on this.

Thanks scottkuhl for patiently waiting while the team is still investigating the issue.

@anawishnoff @RBrid can we please have an update on this issue? Thanks