Programmatically binding List to ListBox


Question

Let's say, for instance, I have the following extremely simple window:

<Window x:Class="CalendarGenerator.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1"
        Height="300"
        Width="447">
  <Grid>
    <ListBox Margin="12,40,0,12"
             Name="eventList"
             HorizontalAlignment="Left"
             Width="134" />
  </Grid>
</Window>

And a simple list defined as:

List<String> ListOfNames = new List<String>();

And let's assume that the list has several names in it. How would I go about binding the List to the ListBox using as much code-behind as possible?

1
22
7/31/2019 8:09:26 PM

Accepted Answer

First you'd need to give your ListBox a name so that it's accessible from your code behind (edit I note you've already done this, so I'll change my example ListBox's name to reflect yours):

<ListBox x:Name="eventList" ... />

Then it's as simple as setting the ListBox's ItemsSource property to your list:

eventList.ItemsSource = ListOfNames;

Since you've defined your "ListOfNames" object as a List<String>, the ListBox won't automatically reflect changes made to the list. To get WPF's databinding to react to changes within the list, define it as an ObservableCollection<String> instead.

39
1/16/2009 3:41:21 AM

If the data list is created in code then you're going to have to bind it in code, like so:

eventList.ItemsSource = ListOfNames;

Now binding to a list of strings is a very simple example. Let's take a more complex one.

Say you have a person class:

public class Person {
    public string FirstName { get; set; }
    public string Surname { get; set; }
}

To display a list of persons you could bind a list to the ListBox, but you'll end up with a listbox that displays "Person" for each entry, because you haven't told WPF how to display a person object.

To tell WPF how to visually display data objects we define a DataTemplate like so:

<Window.Resources>
    <DataTemplate DataType="{x:Type l:Person}">
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="{Binding FirstName}"/>
            <TextBlock Text=" "/>
            <TextBlock Text="{Binding Surname}"/>
        </StackPanel>
    </DataTemplate>
</Window.Resources>
<Grid>
    <ListBox Name="listBox" />
</Grid>

public Window1() {
    InitializeComponent();
    List<Person> people = new List<Person>();
    people.Add(new Person() { FirstName = "Cameron", Surname = "MacFarland" });
    people.Add(new Person() { FirstName = "Bea", Surname = "Stollnitz" });
    people.Add(new Person() { FirstName = "Jason", Surname = "Miesionczek" });
    listBox.ItemsSource = people;
}

This will nicely display "Firstname Surname" in the list.

If you wanted to change the look to be say "Surname, Firstname" all you need to do is change the XAML to:

<StackPanel Orientation="Horizontal">
    <TextBlock FontWeight="Bold" Text="{Binding Surname}"/>
    <TextBlock Text=", "/>
    <TextBlock Text="{Binding FirstName}"/>
</StackPanel>

Licensed under: CC-BY-SA with attribution
Not affiliated with: Stack Overflow
Icon