Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to make a WPF DataGrid display a ViewModel collection with binding and a DataTemplate

First off, an apology as I am sure this is question's answer is quite simple. Nonetheless I still cannot seem to find an answer.

This is my first week using WPF. I simply wish to display the contents of some sort of list inside of a DataGrid. I am currently trying to use an ObservableCollection<> and a DataGrid, but that can change. How do I DataTemplate the list and display it?

The list is in a ViewModel, which has been set in Apps.xaml.cs as the DataSource for the MainWindow.xaml:

protected override void OnStartup(StartupEventArgs e)
{
    base.OnStartup(e);

    var window = new MainWindow();

    // Create the ViewModel to which 
    // the main window binds.
    var viewModel = new MainWindowViewModel();

    // Allow all controls in the window to 
    // bind to the ViewModel by setting the 
    // DataContext, which propagates down 
    // the element tree.
    window.DataContext = viewModel;

    window.Show();
}

Here is the current list:

    public ObservableCollection<PersonData> SearchResults { get; set; }

As for my xaml, though, I am rather lost -- I've tried fiddling around with binding and ItemsSource, and really have no idea how to use them here. Also, I suppose using a DataTemplate will be necessary, as I need to let it know somehow that the columns need to display certain properties of the PersonData, such as first and last name, location, and title. Any help is appreciated.

EDIT

More generally -- how does one simply display a ViewModel list, collection, what have you, period?

like image 872
Bondolin Avatar asked Jul 06 '12 19:07

Bondolin


2 Answers

Your basic DataGrid syntax should look something like this:

<DataGrid ItemsSource="{Binding SearchResults}"
          AutoGenerateColumns="False">
    <DataGrid.Columns>
        <DataGridTextColumn Header="First Name"  Binding="{Binding FirstName}"/>
        <DataGridTextColumn Header="Last Name" Binding="{Binding LastName}" />
    </DataGrid.Columns>
</DataGrid>

If you don't want to display your data in a DataGrid, you can use an ItemsControl.

The default ItemsControl will add all your items to a StackPanel, and draw each of them using a TextBlock bound to the .ToString() of the item. You can change how the ItemsControl displays the items by specifying your own ItemsPanelTemplate and ItemTemplate for it to use. For some examples, check out my blog post on WPF's ItemsControl.

like image 80
Rachel Avatar answered Oct 11 '22 13:10

Rachel


Ach. Failure to pre-study is fatal -- I did not implement INotifyPropertyChanged. Found out how to here: http://msdn.microsoft.com/en-us/library/ms743695

like image 21
Bondolin Avatar answered Oct 11 '22 15:10

Bondolin