WPF 自定义数据网格列标题

本文介绍了WPF 自定义数据网格列标题的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我需要创建一个自定义 dataGrid DataGridTextColumn，如下图所示:

I need to create a Custom dataGrid DataGridTextColumn like the sketch below:

红色矩形是 TextBox，用于在列内搜索.

The Red rectangles are TextBox and are used to search within the column.

到目前为止，我已经实现了这样的数据网格(简化版):

so far i have implemented a datagrid like this (simplify Version):

<DataGrid x:Name="CompassLogDataGrid" Grid.Row="1" Style="{DynamicResource ResourceKey=DataGridStyle}" IsTextSearchEnabled="True"> <DataGrid.Columns> <DataGridTextColumn CellStyle="{StaticResource IdCell}" x:Name="ID" Header="ID" Foreground="Black" Binding="{Binding ID}" DisplayIndex="0" /> <DataGridTextColumn x:Name="DateGTC" Header="Date" Binding="{Binding DateString}" CellStyle="{StaticResource DateGTCCell}" /> </DataGrid.Columns </DataGrid

我不知道如何创建这些文本框.任何线索将不胜感激

I have no idea how to create those textBoxes. Any clue would be appreciate it

推荐答案

DataGridTemplateColumn 正是您要找的.您可以根据需要自定义模板 -

DataGridTemplateColumn is what you are looking for. You can customize the template as per your need -

<DataGrid> <DataGrid.Columns> <DataGridTemplateColumn> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBox BorderBrush="Red" BorderThickness="3" Margin="5"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate> </DataGridTemplateColumn> </DataGrid.Columns> </DataGrid>

使用示例 ItemsSource 它给出了这样的外观 -

With sample ItemsSource it gives this look -

编辑

如果您想自定义标题，则需要像这样为您的列提供 HeaderTemplate -

In case you want to customize the header, you need to provide HeaderTemplate for your column like this -

<DataGrid> <DataGrid.Columns> <DataGridTextColumn Binding="{Binding Name}" Header="{Binding HeaderName}"> <DataGridTextColumn.HeaderTemplate> <DataTemplate> <StackPanel> <TextBlock Text="{Binding Content, RelativeSource= {RelativeSource Mode=TemplatedParent}}" Margin="5"/> <TextBox BorderBrush="Red" BorderThickness="3" Width="50" Margin="5"/> </StackPanel> </DataTemplate> </DataGridTextColumn.HeaderTemplate> </DataGridTextColumn> </DataGrid.Columns> </DataGrid>

这是外观-