Not able to add image in a DataTable in WPF

Question

I am struck up with a peculiar problem wherein I want to add an image that is there in my Resources folder in my WPF solution. I am getting the image path instead of the image name (../../Resources/Excel.png). I have tried so many things like converting image to Byte[] but it doesnt seem to work. Here is my code.

 public DataTable BDU_DtmDcmDfmSelect(string Tablename)
        {


            DataTable tableData = new DataTable();
            tableData = dal.DAL_BDU_DtmDcmDfmSelect(Tablename);

            // All filter column in list
            List<String> FilterColumns = new List<string>();
            FilterColumns.Add("INS_DTE"); FilterColumns.Add("UPDD_DTE");
            FilterColumns.Add("DEL_DTE"); FilterColumns.Add("INSD_BY");
            FilterColumns.Add("UPDD_BY"); FilterColumns.Add("DELD_BY");

            // Reading all table column to a list as can not run loop when removing
            List<String> TableColumns = new List<string>();
            foreach (var text in tableData.Columns)
            {
                TableColumns.Add(text.ToString());
            }

            // Running loop by comparing the both the column to avoid exception
            foreach (string tablecol in TableColumns)
            {
                foreach (string filtercol in FilterColumns)
                {
                    if (tablecol == filtercol)
                    {
                        tableData.Columns.Remove(filtercol);
                    }
                }

            }

            //tableData.Columns.Add("Edit", typeof(bool)) ;
            //tableData.Columns.Add("Delete" ,typeof(bool));

            //DataColumn workCol = tableData.Columns.Add("CustID", typeof(int));

            //for (int i = 0; i < tableData.Columns.Count; i++)
            //{
            //    if (i == (tableData.Columns.Count-1))
            //    {
            //        for (int j = 0; j < tableData.Rows.Count; j++)
            //        {
            //            tableData.Rows[j][i] = 5;
            //        }

            //    }
            //}


            tableData.Columns.Add("EditImage", typeof(BitmapImage));

             BitmapImage image = new BitmapImage(new Uri("../../Resources/Excel.png", UriKind.RelativeOrAbsolute));

            // ;
           /// Image img = new Image();

            //img.Source = @"../../Resources/Excel.png";
            for (int i = 0; i < tableData.Columns.Count; i++)
            {
                if (i == (tableData.Columns.Count - 1))
                {
                    for (int j = 0; j < tableData.Rows.Count; j++)
                    {
                         tableData.Rows[j][i] = image;
                    }

                }
            }

            tableData.Columns.Add("EditImage1", typeof(Image));

            Button btn = new Button();

            btn.Content = "Edit";
            btn.Background = new SolidColorBrush(Color.FromArgb(200, 233, 222, 100));

            for (int i = 0; i < tableData.Columns.Count; i++)
            {
                if (i == (tableData.Columns.Count - 1))
                {
                    for (int j = 0; j < tableData.Rows.Count; j++)
                    {
                        tableData.Rows[j][i] = btn;
                    }

                }
            }


            //DataColumn imagecol = new DataColumn();
            //tableData.Columns.Add(imagecol);
            //DataColumn imagecol1 = new DataColumn();
            //imagecol1.DataType = System.Type.GetType("System.Byte[]");




            return tableData;
        }

The above method has been called and the output has been assigned to a GridView

 public void displayTableData(String TableName)
        {

            var TableName1 = CmbMasterTable.SelectedItem.ToString();
            var Tablename2 = CmbMasterTable.SelectedValue.ToString();
            var Tablename3 = CmbMasterTable.SelectionBoxItem.ToString();
            if (!string.IsNullOrEmpty(TableName))
            {
                DisplayGrid.ItemsSource = dcobj.BDU_DtmDcmDfmSelect(TableName).DefaultView;
            }

            if (!string.IsNullOrEmpty(TableName1))
            {
                DisplayGrid.ItemsSource = dcobj.BDU_DtmDcmDfmSelect(TableName1).DefaultView;
            }
        } 

The specific XAML would be

 <DataGrid x:Name="DisplayGrid" Grid.Row ="1" >

                    </DataGrid>

Please assist.

Answer 1

A DataGrid doesn't know how to render a DataColumn with a of type Image. You need to use a converter or a template to be able to display it:

DisplayGrid.AutoGeneratingColumn += (s, e) =>
{
    const string Xaml = "<DataTemplate xmlns=\"http://schemas.microsoft.com/winfx/2006/xaml/presentation\"><ContentControl Content=\"{{Binding {0}}}\" /></DataTemplate>";
    if (e.PropertyType == typeof(Image))
    {
        DataGridTemplateColumn tc = new DataGridTemplateColumn();
        tc.CellTemplate = System.Windows.Markup.XamlReader.Parse(string.Format(Xaml, e.PropertyName)) as DataTemplate;
        e.Column = tc;
    }
};