Добавление изображения и контроля текстового блока внутри заголовка DataGridTemplateColumn

Question

В нашем приложении WPF у нас есть экран, на котором отображается сетка, заголовок столбца прямо сейчас является текстом, я должен добавить изображение рядом с текстом. Это код XAML,

<Custom:DataGrid.Columns> 
     <Custom:DataGridTemplateColumn Header="{Binding EmailIDHeader, Source={StaticResource LiteralDictionary}}" Width = "0.1*" CellTemplate="{StaticResource EmailIDTemplate}" SortMemberPath="EmailID"/> 
</Custom:DataGrid.Columns> 

<DataTemplate x:Key="EmailIDTemplate"> 
     <Grid MinWidth="10" Margin="5,0,5,0"> 
      <TextBlock HorizontalAlignment="Left" Text="{Binding customerItem.EmailID}" Margin="0,0,3,0"/> 
     </Grid> 

EMailIDHeader загрузит значение текста для заголовка, я должен добавить изображение рядом с ним. Как мне это достичь? Я попробовал решение, данное here. Но это просто показывает мне пустой столбец заголовка.

Answer 1

Определите DataTemplate, где вы упорядочиваете свой текстовый блок и свое изображение по своему усмотрению и задаете для этого свойства HeaderTemplate.

Шаблон данных для заголовка:

<DataTemplate x:Key="EmailIDHeaderTemplate"> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition/> 
       <RowDefinition/> 
      </Grid.RowDefinitions> 
      <Image Source="SPhotoEditor-20170120_075433.jpg" Width="20" Height="20"></Image> 
      <TextBlock HorizontalAlignment="Left" Text="{Binding EmailIDHeader, Source={StaticResource LiteralDictionary}}" Margin="0,0,3,0"/> 

     </Grid> 
</DataTemplate> 

Для клетки:

<DataTemplate x:Key="EmailIDTemplate"> 
    <Grid MinWidth="10" Margin="5,0,5,0"> 
     <TextBlock HorizontalAlignment="Left" Text="{Binding customerItem.EmailID}" Margin="0,0,3,0"/> 
    </Grid> 
</DataTemplate> 

Ваша сетка:

<Custom:DataGrid.Columns> 
    <Custom:DataGridTemplateColumn HeaderTemplate="{StaticResource EmailIDHeaderTemplate}" CellTemplate="{StaticResource EmailIDTemplate}" Width = "0.1*" SortMemberPath="EmailID"/> 
</Custom:DataGrid.Columns> 

Answer 2

Если предположить, что модель является

public class Model : INotifyPropertyChanged 
{ 
    string _value; 
    public string Value{ get { return _value; } set { _value = value; RaisePropertyChanged("Value"); } } 

    public event PropertyChangedEventHandler PropertyChanged; 
    void RaisePropertyChanged(string propname) 
    { 
     PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propname)); 
    } 
} 

и есть два свойства в виде модели:

string _name; 
    public string Name { get { return _name; } set { _name = value; RaisePropertyChanged("Name"); } } 


    string _imagePath; 
    public string ImagePath { get { return _imagePath; } set { _imagePath = value; RaisePropertyChanged("ImagePath"); } } 

Вы можете использовать следующий вид:

<DataGrid DataContext="{Binding}" ItemsSource="{Binding Models}" AutoGenerateColumns="False"> 
     <DataGrid.Columns> 
      <DataGridTemplateColumn> 
       <DataGridTemplateColumn.HeaderTemplate> 
        <DataTemplate> 
         <StackPanel> 
          <TextBlock Text="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}, Path=DataContext.Name}"/> 
          <Image Source="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGrid}}, Path=DataContext.ImagePath}"/> 
         </StackPanel> 
        </DataTemplate> 
       </DataGridTemplateColumn.HeaderTemplate> 
       <DataGridTemplateColumn.CellTemplate> 
        <DataTemplate> 
         <TextBlock Text="{Binding Value}"/> 
        </DataTemplate> 
       </DataGridTemplateColumn.CellTemplate> 
      </DataGridTemplateColumn> 
     </DataGrid.Columns> 
    </DataGrid>