Datagrid自定义标题 [英] Datagrid custom header

问题描述

我想为Datagrid的标题行添加一个额外的行，它将包含文本框（用于搜索）。

此行应直接显示在原始标题下，并且看起来像常规项标题。

I want to add an extra row to Datagrid's header row that will contain textboxes (for searching).
This row should appear directly under the original header and look like regular item header.

这是迄今为止的代码：

 <Window.Resources>
        <Style x:Key="DataGridColumnHeaderStyle1" TargetType="{x:Type DataGridColumnHeader}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type DataGridColumnHeader}">

                        <Grid VerticalAlignment="Center" HorizontalAlignment="Stretch">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="*"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <TextBlock Grid.Row="0" Text="" HorizontalAlignment="Stretch"/>
                            <Grid Grid.Row="1">
                                <TextBox Text="" HorizontalAlignment="Stretch" BorderThickness="1" />
                            </Grid>
                        </Grid>

                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <Grid x:Name="LayoutRoot">
        <DataGrid x:Name="dataGrid" Height="157" Width="600" Margin="8,8,24,0"
                  VerticalAlignment="Top"
                  AutoGenerateColumns="False"
                  ColumnHeaderStyle="{DynamicResource DataGridColumnHeaderStyle1}"
                  ItemsSource="{Binding}" CanUserAddRows="False"
                  >

            <DataGrid.Columns>
                <DataGridTextColumn Header="Header1" Binding="{Binding Id}" Width="100" />
                <DataGridTextColumn Header="Header2" Binding="{Binding Name}" Width="100"/>
                <DataGridTextColumn Header="Header3" Binding="{Binding Phone}" Width="100"/>
                <DataGridTextColumn Header="Header4" Binding="{Binding Address}" Width="100"/>
                <DataGridTextColumn Header="Header5" Binding="{Binding Description}" Width="*"/>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</Window>

我的contentTemplate的问题是它没有得到定义的头标题。

The problem with my contentTemplate that it doesn't get the "header title" that is defined in .

推荐答案

如果我正确理解你，我想你想要这样的东西：

If I understand you correctly, I think you want something like this:

<TextBox Text="{TemplateBinding Content}" HorizontalAlignment="Stretch" BorderThickness="1" />

这将把您将Header属性键入的文本作为文本框中的文本。

This puts the text you typed the Header attribute as text in the text box.

编辑：
模板绑定工作原理是因为您正在从模板标题到您在样式之外定义的标题进行绑定。换句话说， TemplateBinding 标记与源的绑定作为实际头。

Template binding works because your are making a binding from the templated header to the header you define outside of the style. In other words, the TemplateBinding markup does a binding with the source as the actual header.

要清楚一点， TemplateBinding 与相同Binding RelativeSource = {RelativeSource TemplatedParent}} 。所以这是一个绑定，其中源是DataGridColumnHeader。当这种风格应用于数据网格时，标题就成为模板化的父类。所以绑定只是绑定到模板化的父项的内容，这是你的< DataGridTextColumn Header =Header1Binding ={Binding Id}Width =100/>

To be a little clearer, TemplateBinding is the same as Binding RelativeSource={RelativeSource TemplatedParent}}. So this does a binding where the source is a DataGridColumnHeader. And when this style is applied to the data grid, the headers become that templated parent. So the binding simply binds to the Content of the templated parent which is your <DataGridTextColumn Header="Header1" Binding="{Binding Id}" Width="100" />

这是msdn的一个链接： TemplateBinding

Here's a link the the msdn: TemplateBinding

这篇关于Datagrid自定义标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！