[C#] datagrid元素居中

最新推荐文章于 2022-09-08 16:23:45 发布

Cedric_6

最新推荐文章于 2022-09-08 16:23:45 发布

阅读量1.5k

点赞数 1

分类专栏： C#

本文链接：https://blog.csdn.net/Cedric_6/article/details/104920417

版权

C# 专栏收录该内容

7 篇文章 8 订阅

订阅专栏

上篇数据库建立结果

在这里插入图片描述
可以看到元素都在最左边，看起来并不美观因此要让元素居中。

第一步设置header居中

MainWindow.xaml

<DataGrid x:Name="info" HorizontalAlignment="Left" AutoGenerateColumns="False" Height="289" Margin="144,70,0,0" VerticalAlignment="Top" Width="500">
			//关键在于header类型设置
            <DataGrid.ColumnHeaderStyle>
                <Style TargetType="DataGridColumnHeader">
                    <Setter Property="HorizontalContentAlignment" Value="Center">
                    </Setter>
                </Style>
            </DataGrid.ColumnHeaderStyle>
            <DataGrid.Columns>
                <DataGridTextColumn Header="ID" Binding="{Binding Id}" Width="250"></DataGridTextColumn>
                <DataGridTextColumn Header="Name" Binding="{Binding Name}" Width="250"></DataGridTextColumn>
            </DataGrid.Columns>
        </DataGrid>

在这里插入图片描述

第二步设置App.xaml

在Application.Resources里设置好类型。

<Application.Resources>
        <DataTemplate x:Key="IdTemplate">
            <TextBlock Text="{Binding Id}" HorizontalAlignment="Center" VerticalAlignment="Center"></TextBlock>
        </DataTemplate>
        <DataTemplate x:Key="NameTemplate">
            <TextBlock Text="{Binding Name}" HorizontalAlignment="Center" VerticalAlignment="Center"></TextBlock>
        </DataTemplate>
    </Application.Resources>

第三步修改MainWindow.xaml

原来

<DataGrid.Columns>
        <DataGridTextColumn Header="ID" Binding="{Binding Id}" Width="250"></DataGridTextColumn>
        <DataGridTextColumn Header="Name" Binding="{Binding Name}" Width="250"></DataGridTextColumn>
</DataGrid.Columns>

修改后

<DataGrid.Columns>
       <DataGridTemplateColumn Header="ID" CellTemplate="{StaticResource IdTemplate}" Width="250"></DataGridTemplateColumn>
       <DataGridTemplateColumn Header="Name" CellTemplate="{StaticResource NameTemplate}" Width="250"></DataGridTemplateColumn>
</DataGrid.Columns>