programatically add a image in Datagrid template c#

Question

The following xaml code binds the "Image" with the datagrid template column.

     <DataGridTemplateColumn Header="">

       <DataGridTemplateColumn.CellTemplate>

           <DataTemplate>

                <Image Source="{Binding Path=Image}" Height="16" Width="16" VerticalAlignment="Top" />

             </DataTemplate>
        </DataGridTemplateColumn.CellTemplate>

   The same thing need to be done in codebehind (c# code)  

       DataGridTemplateColumn im = new DataGridTemplateColumn();
       im.Header = "";
       Binding items1 = new Binding();

this is what i have Tried.... how to bind the datagridtemplate column to a image ??

Anand Murali · Accepted Answer · 2013-01-23T10:37:34.227

Here is the code to add a DataGridTemplateColumn programatically.

http://social.msdn.microsoft.com/Forums/en/wpf/thread/df77a277-91d4-41f1-a42a-0fa02a443ff4

DataGridTemplateColumn imgColumn = new DataGridTemplateColumn();
imgColumn.Header = "Image";

FrameworkElementFactory imageFactory = new FrameworkElementFactory(typeof(Image));
imageFactory.SetBinding(Image.SourceProperty, new Binding("ImgPath"));

DataTemplate dataTemplate = new DataTemplate();
dataTemplate.VisualTree = imageFactory;

imgColumn.CellTemplate = dataTemplate;

DGImages.Columns.Add(imgColumn);

I have also added the source code of the sample app that I created. Hope it helps.

MainWindow.xaml file

<Window x:Class="StackOverflow.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<DataGrid Name="DGImages" AutoGenerateColumns="False">
<DataGrid.Columns>
<DataGridTextColumn Header="Image Desc" Binding="{Binding ImgDesc}"></DataGridTextColumn>
</DataGrid.Columns>
</DataGrid>
</Grid>
</Window>

MainWindow.xaml.cs file

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Collections.ObjectModel;

namespace StackOverflow
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
private ObservableCollection<SampleClass> imgList = null;

public MainWindow()
{
InitializeComponent();
imgList = new ObservableCollection<SampleClass>();
imgList.Add(new SampleClass() { ImgDesc = "First Image", ImgPath = @"/Images/MyImage.jpg" });

DataGridTemplateColumn imgColumn = new DataGridTemplateColumn();
imgColumn.Header = "Image";

FrameworkElementFactory imageFactory = new FrameworkElementFactory(typeof(Image));
imageFactory.SetBinding(Image.SourceProperty, new Binding("ImgPath"));

DataTemplate dataTemplate = new DataTemplate();
dataTemplate.VisualTree = imageFactory;

imgColumn.CellTemplate = dataTemplate;

DGImages.Columns.Add(imgColumn);

this.DGImages.ItemsSource = imgList;
}
}
}

SampleClass.cs file

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.ComponentModel;

namespace StackOverflow
{
public class SampleClass : INotifyPropertyChanged
{
private string _ImgDesc;

public string ImgDesc
{
get { return _ImgDesc; }
set
{
_ImgDesc = value;
OnPropertyChanged("ImgDesc");
}
}

private string _ImgPath;

public string ImgPath
{
get { return _ImgPath; }
set
{
_ImgPath = value;
OnPropertyChanged("ImgPath");
}
}

public event PropertyChangedEventHandler PropertyChanged;

public void OnPropertyChanged(string propertyName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
}
}

Ahhhhhhhhh, misunderstood your question... Now I have edited my answer to include the C# equivalent code. — Anand Murali, Jan 23 '13 at 10:32
Image.SourceProperty i didnt get any property named SourceProperty...Any name space need to be included i have tried system.windows.controls; and system.windows.drawing; — Raghu, Jan 23 '13 at 11:34
System.Windows.Controls ( PresentationFramework.dll) is the correct namespace. http://msdn.microsoft.com/en-us/library/system.windows.controls.image.aspx Which version of .Net are you using? The SourceProperty field is available from .Net 3.0 — Anand Murali, Jan 23 '13 at 11:50
thanx a ton i got the image in the column how to set the width and height for the image in codebehind — Raghu, Jan 23 '13 at 12:19
A simple way... Add these two properties in the SampleClass... public double ImgHeight { get { return 240; } } public double ImgWidth { get { return 240; } } And in the code behind when you create the cell template, add binding for height and width properties as shown below... imageFactory.SetBinding(Image.HeightProperty, new Binding("ImgHeight")); imageFactory.SetBinding(Image.WidthProperty, new Binding("ImgWidth")); — Anand Murali, Jan 23 '13 at 13:17

score 0 · Answer 2 · edited Jan 23 '13 at 08:06

0

Can you try changing to

<DataGridTemplateColumn Header="Image">

and

<Image Source="{Binding Image}" /> maybe this one 2

edited Jan 23 '13 at 08:06

Echilon

10,064
33
131
217

answered Jan 23 '13 at 07:32

Raghavan

637
3
12

i want the c# equivalent of what you said .i cant make changes in my xaml. make a datagridtemplate column in c# and add a image to it and image source should be binded – Raghu Jan 23 '13 at 09:54

programatically add a image in Datagrid template c#

2 Answers2