WPF DataGridTemplateColumn 单元格样式不显示值答案

【问题标题】：WPF DataGridTemplateColumn cell style not displaying valueWPF DataGridTemplateColumn 单元格样式不显示值
【发布时间】：2018-03-09 08:35:41
【问题描述】：

我正在尝试为 datagridcell 创建一个样式。但未显示文本值。数据网格由 Student 类型的 Observable 集合填充。请在下面找到我的 xaml 代码。

StdCollection = new ObservableCollection<Student>()
            {
                new Student(){Name="Ram",StudID=01,Total=88},
                new Student(){Name="John",StudID=02,Total=55},
                new Student(){Name="Amar",StudID=03,Total=77},
                new Student(){Name="Azar",StudID=04,Total=98},
            };

<DataGrid Name="dgTest" CanUserAddRows="False" CanUserResizeColumns="True" CanUserSortColumns="True" IsReadOnly="False"
              HorizontalAlignment="Left" Height="194" Margin="37,36,0,0" VerticalAlignment="Top" Width="236"                  
              ItemsSource="{Binding StdCollection,UpdateSourceTrigger=PropertyChanged}"
              AutoGenerateColumns="False" 
              >
<DataGrid.Columns>
            <DataGridTemplateColumn  Header="StudID" >
                <DataGridTemplateColumn.CellStyle>
                    <Style TargetType="{x:Type DataGridCell}">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="{x:Type DataGridCell}">
                                    <Border x:Name="border"
                                    Background="WhiteSmoke"
                                    BorderBrush="Transparent"
                                    BorderThickness="2"
                                    SnapsToDevicePixels="True">
                                        <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
                                            <ContentPresenter.ContentTemplate>
                                                <DataTemplate>
                                                    <Border BorderBrush="Red" BorderThickness="1">
                                                        <TextBlock Foreground="Gray" FontSize="18" Text="{Binding StudID}"/>
                                                    </Border>
                                                </DataTemplate>
                                            </ContentPresenter.ContentTemplate>
                                        </ContentPresenter>
                                    </Border>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </DataGridTemplateColumn.CellStyle>
            </DataGridTemplateColumn>
            <DataGridTextColumn Header="Name" Binding="{Binding Name,UpdateSourceTrigger=PropertyChanged}" />
            <DataGridTextColumn Header="Total" Binding="{Binding Total,UpdateSourceTrigger=PropertyChanged}"/>               
        </DataGrid.Columns>

我得到的是空白单元格而不是值。请让我知道我哪里做错了。

【问题讨论】：

标签： wpf datagrid

【解决方案1】：

你的模板列应该是

<DataGridTemplateColumn Header="Id" >
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <Border x:Name="border"
                                            Background="WhiteSmoke"
                                            BorderBrush="Transparent"
                                            BorderThickness="2"
                                            SnapsToDevicePixels="True">
                            <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
                                <ContentPresenter.ContentTemplate>
                                    <DataTemplate>
                                        <Border BorderBrush="Red" BorderThickness="1">
                                            <TextBlock Foreground="Gray" FontSize="18" Text="{Binding StudID}"/>
                                        </Border>
                                    </DataTemplate>
                                </ContentPresenter.ContentTemplate>
                            </ContentPresenter>
                        </Border>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>

继续：

<Window.Resources>
    <DataTemplate x:Key="columnTemplate">
        <Border BorderBrush="Red" BorderThickness="1">
            <TextBlock Foreground="Gray" FontSize="18" Text="{Binding Id}"/>
        </Border>
    </DataTemplate>
</Window.Resources>
<Grid x:Name="MainGrid">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <DataGrid Name="dgMainGrid" CanUserAddRows="False" CanUserResizeColumns="True" CanUserSortColumns="True" IsReadOnly="False"
              HorizontalAlignment="Left" Height="194" Margin="37,36,0,0" VerticalAlignment="Top" Width="236"                                
              AutoGenerateColumns="False">
        <DataGrid.Columns>
            <DataGridTemplateColumn Header="Id" CellTemplate="{StaticResource columnTemplate}"/>
            <DataGridTextColumn Header="Name" Binding="{Binding Description, UpdateSourceTrigger=PropertyChanged}" />
        </DataGrid.Columns>
    </DataGrid>
</Grid>

【讨论】：

是的，这会很好。但我想知道为什么我的风格没有显示出价值。我正在尝试制作一种通用样式以应用于数据网格中的所有单元格。
制作一个通用的 DataTemplate，给它一个键，然后在需要的地方使用它。样式是用来给控件设置样式的，这里用模板代替样式比较合适。

【解决方案2】：

有两种方法可以解决此问题。

（我看到第一个已经被 Raviraj 照顾好了）

第二个是实际分离单元格样式和内容。您当前的代码不起作用，因为 TextBlock 缺少 DataContext（在 CellStyle 本身中不可用）：

<DataGridTemplateColumn Header="StudID">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <TextBlock Foreground="Gray" FontSize="18" Text="{Binding StudID}"/>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
    <DataGridTemplateColumn.CellStyle>
        <Style TargetType="{x:Type DataGridCell}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type DataGridCell}">
                        <Border x:Name="border"
                            Background="WhiteSmoke"
                            BorderBrush="Transparent"
                            BorderThickness="2"
                            SnapsToDevicePixels="True">
                            <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
                                <ContentPresenter.ContentTemplate>
                                    <DataTemplate>
                                        <Border BorderBrush="Red" BorderThickness="1">
                                            <ContentPresenter Content="{TemplateBinding Content}"/>
                                        </Border>
                                    </DataTemplate>
                                </ContentPresenter.ContentTemplate>
                            </ContentPresenter>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </DataGridTemplateColumn.CellStyle>
</DataGridTemplateColumn>

您当然可以简单地使用 TextColumn：

<DataGridTextColumn Binding="{Binding StudID}" Header="StudID" FontSize="18" Foreground="Gray">
    <DataGridTextColumn.CellStyle>
        <Style TargetType="{x:Type DataGridCell}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type DataGridCell}">
                        <Border x:Name="border"
                            Background="WhiteSmoke"
                            BorderBrush="Transparent"
                            BorderThickness="2"
                            SnapsToDevicePixels="True">
                            <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}">
                                <ContentPresenter.ContentTemplate>
                                    <DataTemplate>
                                        <Border BorderBrush="Red" BorderThickness="1">
                                            <ContentPresenter Content="{TemplateBinding Content}"/>
                                        </Border>
                                    </DataTemplate>
                                </ContentPresenter.ContentTemplate>
                            </ContentPresenter>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </DataGridTextColumn.CellStyle>
</DataGridTextColumn>

【讨论】：