Add column to list containing image

Question

I want to add a string using data from ExpandoObject , which is similar to Dictionary<string, object> . string is the column heading, and object is the column value. Every time I get new data, I create a new GridView , because the number of columns may be different. In List myItems are all the Dictionary<string, object> lines that I want to show in my view.

This is how I add columns to my view:

  List<Column> columns = new List<Column>(); myItemValues = (IDictionary<string, object>)myItems[0]; // Key is the column, value is the value foreach (var pair in myItemValues) { Column column = new Column(); column.Title = pair.Key; column.SourceField = pair.Key; columns.Add(column); } view.Columns.Clear(); foreach (var column in columns) { Binding binding = new Binding(column.SourceField); if (column.SourceField == "Icon") { view.Columns.Add(new GridViewColumn { Header = column.Title, DisplayMemberBinding = binding, CellTemplate = new DataTemplate(typeof(Image)) }); } else { view.Columns.Add(new GridViewColumn { Header = column.Title, DisplayMemberBinding = binding }); } } 

Right after that I try to add the lines:

  foreach (dynamic item in myItems) { this.listView.Items.Add(item); } 

I tried to change this solution for other purposes. This solution works very well if I only want to add values ​​of type string , but now I also want to display image in gridview, but if I add it to gridview, it will show me simply:

"System.Windows.Controls.Image"

Now I want to know if I can change my code so that I can display any type (or at least images and strings ) in gridview, or do I need to use a completely new way and path?

EDIT: In previous approaches, it was said that I needed to create a new DataTemplate to show the image, but none of the solutions ( Decision 1 , Decision 2 ) I found a job for me.

Answer 1

The best way is to define a DataTemplate for the Icon column in the resources, and then load it when creating a column for the icon. I modified your code to show this approach.

Xaml

 <Window x:Class="ListViewIcon.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:local="clr-namespace:ListViewIcon" mc:Ignorable="d" Title="MainWindow" Height="350" Width="525"> <Window.Resources> <ResourceDictionary> <DataTemplate x:Key="iconTemplate"> <Image Source="{Binding Icon}" Width="64" Height="64"/> </DataTemplate> </ResourceDictionary> </Window.Resources> <Grid> <ListView x:Name="myListView"></ListView> </Grid> </Window> 

FROM#

 public class Column { public string Title { get; set; } public string SourceField { get; set; } } public partial class MainWindow : Window { private BitmapImage LoadImage() { var img = new BitmapImage(); img.BeginInit(); img.UriSource = new Uri(@"D:\image.png", UriKind.Absolute); img.CacheOption = BitmapCacheOption.OnLoad; img.EndInit(); return img; } public MainWindow() { InitializeComponent(); GridView gridView = new GridView(); this.myListView.View = gridView; List<dynamic> myItems = new List<dynamic>(); dynamic myItem; IDictionary<string, object> myItemValues; var image = LoadImage(); // Populate the objects with dynamic columns for (var i = 0; i < 100; i++) { myItem = new System.Dynamic.ExpandoObject(); foreach (string column in new string[] { "Id", "Name", "Something" }) { myItemValues = (IDictionary<string, object>)myItem; myItemValues[column] = "My value for " + column + " - " + i; } myItem.Icon = image; myItems.Add(myItem); } // Assuming that all objects have same columns - using first item to determine the columns List<Column> columns = new List<Column>(); myItemValues = (IDictionary<string, object>)myItems[0]; // Key is the column, value is the value foreach (var pair in myItemValues) { Column column = new Column(); column.Title = pair.Key; column.SourceField = pair.Key; columns.Add(column); } // Add the column definitions to the list view gridView.Columns.Clear(); foreach (var column in columns) { if (column.SourceField == "Icon") { gridView.Columns.Add(new GridViewColumn { Header = column.Title, CellTemplate = FindResource("iconTemplate") as DataTemplate }); } else { var binding = new Binding(column.SourceField); gridView.Columns.Add(new GridViewColumn { Header = column.Title, DisplayMemberBinding = binding }); } } // Add all items to the list foreach (dynamic item in myItems) { this.myListView.Items.Add(item); } } } 

results

Answer 2

I doubt that you can use your solution as part of the approach you are using. It works great for text data types that have a valid ToString () representation that suits you. To work with a complex data type, such as Images, you will probably have to use Templates , as it is Shadowed metioned, where you have to set different properties for each complex type. For example, for an image this can be the size and source, for a button, the background color. As an option, you can create some kind of factory template and apply CellTemplateSelector , which will provide you with incomplete templates, but this, as you already said, is a completely new way.