UWP 数据网格中的中心列 header

Question

我正在尝试使 DataGrid 中的列 header 居中。要在 UWP UI 中添加 DataGrid，我正在使用 microsoft 文档 link enter link description here . I tried searching here but there is solution for WPF only it's in this link enter link description here 中提到的 nuget 包 "Microsoft.Toolkit.Uwp.UI.Controls.DataGrid"。

在这段代码中我不能使用 TargetType="DataGridColumnHeader".

<controls:DataGrid.Columns>
 <controls:DataGridTextColumn Header="Area Name" Binding="{Binding Height_m}" Width="*">
  <controls:DataGridTextColumn.HeaderStyle>
   <Style TargetType="DataGridColumnHeader">
     <Setter Property="HorizontalContentAlignment" Value="Center" />
   </Style>
  </controls:DataGridTextColumn.HeaderStyle>
 </controls:DataGridTextColumn>
</controls:DataGrid.Columns>

显示异常：名称 "DataGridColumnHeader" 在命名空间 "using:Microsoft.Toolkit.Uwp.UI.Controls".

中不存在

Answer 1

DataGridColumnHeader不在Microsoft.Toolkit.Uwp.UI.Controls命名空间下，而是在Microsoft.Toolkit.Uwp.UI.Controls.Primitives命名空间下。

所以需要添加对应的命名空间引用：

xmlns:prim="using:Microsoft.Toolkit.Uwp.UI.Controls.Primitives"

...

<controls:DataGrid.ColumnHeaderStyle>
    <Style TargetType="prim:DataGridColumnHeader">
        <Setter Property="HorizontalContentAlignment" Value="Center" />
        <Setter Property="MinWidth" Value="200" />
    </Style>
</controls:DataGrid.ColumnHeaderStyle>

设置MinWidth是为了更好的查看居中效果，如果不需要可以删除。

但是由于列的宽度受列内容的影响，你可能会观察到表头没有居中，这时可以考虑设置一个MinWidth.

谢谢

UWP 数据网格中的中心列 header

Center column header in datagrid in UWP

c#

uwp

uwp-xaml

windows-community-toolkit