Add image to ListView C# WPF (without xaml)

Question

How can I make an image item in ListView? I need to do it without xaml, only C#. I was surfing about 40 min about it and have nothin found. I've tried a lot of things and i stopped here in first column i see just "System.Windows.Controls.StackPanel".

 public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        GridView grView = new GridView();
        GridViewColumn gwCol1 = new GridViewColumn();
        GridViewColumn gwCol2 = new GridViewColumn();
        gwCol1.Header = "Avatar";
        gwCol2.Header = "Name";
        gwCol2.DisplayMemberBinding = new Binding("name");
        gwCol1.DisplayMemberBinding = new Binding("stack");
        grView.Columns.Add(gwCol1);
        grView.Columns.Add(gwCol2);
        listView1.View = grView;
        //
        var list = new List<XData>();
        listView1.ItemsSource = list;
        // 
        BitmapImage image1 = new BitmapImage(new Uri(@"C:\Users\montana\OneDrive\Pictures\Saved Pictures\WVQfZqY.jpg"));
        Image img = new Image();
        img.Width = 100;
        img.Height = 100;
        img.Source = image1;
        StackPanel stackPanel1 = new StackPanel();
        stackPanel1.Orientation = Orientation.Horizontal;
        stackPanel1.Children.Add(img);
        list.Add(new XData() { name="hola", stack=stackPanel1 });

    }
}


class XData
{
    public string name { get; set; }
   // public string url { get; set; }
    public StackPanel stack { get; set; }
}

*"without xaml"* is contradictory as you have some `listView1` here which is simply lacking datatemplate (itemtemplate?). Without it you have to [create `ListBoxItem`](http://stackoverflow.com/a/13267883/1997232) explicitly (passing bitmap as its `Content`) instead of passing some `List<>` as `ItemsSource`.. — Sinatr, Mar 06 '17 at 12:27
Besides that, you should either use an ObservableCollection instead of a List, or add items before you assign the List to the ItemsSource property. — Clemens, Mar 06 '17 at 12:32
And why do you create the GridView and its columns in code behind when the ListView itself is declared in XAML? — Clemens, Mar 06 '17 at 12:36

score 2 · Accepted Answer · edited May 23 '17 at 12:10

Here is something what produce wanted result.

Change XData definition to avoid having view elements there (you didn't mention MVVM, but it's good to stick to):

class XData
{
    public string Name { get; set; }
    public string Path { get; set; }
}

Now you can either define data template in xaml (common solution) or generate it in code behind like this:

var factory = new FrameworkElementFactory(typeof(Image));
factory.SetValue(Image.SourceProperty, new Binding(nameof(XData.Path)));
factory.SetValue(Image.WidthProperty, 100.0);
factory.SetValue(Image.HeightProperty, 100.0);
var dataTemplate = new DataTemplate { VisualTree = factory };

Data template can be as complicated as you like, but obviously defining it in xaml and then loading with FindResource() is way easier, consider to use this option instead.

And then this datatemplate has to be specified as CellTemplate like this:

GridView grView = new GridView();
grView.Columns.Add(new GridViewColumn { Header = "Avatar", CellTemplate = dataTemplate });
grView.Columns.Add(new GridViewColumn { Header = "Name", DisplayMemberBinding = new Binding(nameof(XData.Name)) });
listView1.View = grView;

Note: you shouldn't use DisplayMemberBinding for column with CellTemplate.

Now, finally, you can fill ListView by setting its ItemSource as usual:

var list = new List<XData>();
list.Add(new XData { Name = "hola", Path = @"c:\temp\1.jpg" });
list.Add(new XData { Name = "hola2", Path = @"c:\temp\2.png" });
listView1.ItemsSource = list;

Thanks. But, how can I replace nameof? im using visual studio 2012 — AndrewMontana, Mar 06 '17 at 14:03
Instead of `nameof(somemember)` use `"somemember"` (in your case it's `"Name"` and `"Path"` appropriately). — Sinatr, Mar 06 '17 at 14:11

Add image to ListView C# WPF (without xaml)

1 Answers1