Question

How do I get VS to populate my ListView with sample data in the Design panel?

I’m stumped. I’ve done a fair bit of reading and googling and can’t find a solid answer. Showing fake data in the VS Design panel would greatly speed up theming as I wouldn’t have to debug it every few changes.

Here is my code:

XAML:

<ListView DataContext="{Binding}"
          Name="PeopleListView">
    <ListView.ItemTemplate>
        <DataTemplate DataType="Person">
                <WrapPanel>
                    <TextBlock Text="{Binding Path=FirstNameView}"/>
                    <TextBlock Text="{Binding Path=LastNameView}" />
                </WrapPanel>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

COLLECTION:

public class People : ObservableCollection<Person>
{
    public People()
    {
        this.Add(new Person() { FirstName = "John", LastName = "Doe" });
        this.Add(new Person() { FirstName = "John", LastName = "Doe" });
        this.Add(new Person() { FirstName = "John", LastName = "Doe" });
    }
}

MAIN:

private People PList;

public MainWindow()
{
    this.PList = new People();
    PeopleListView.ItemsSource = this.PList;
}

EDIT & PROGRESS:

I read through the tutorials found in the link provided by Matt West. They were very helpful. I almost got this figured out.

I ran into a problem when the Designer tries to display the Sample Data. I get this error on my sample properties: Writable property or collection expected. I understand the error, I just don’t know how to fix it without giving each property a set statement.

Here is my code:

Person Class:

public class Person : INotifyPropertyChanged
{
    private string _FirstName;
    private string _LastName;

    public string FirstName
    {
        get { return this._email; }
        set
        {
            this._FirstName = value;
            OnPropertyChanged("FirstName");
            OnPropertyChanged("FirstNameView");
        }
    }
    public string LastName
    {
        get { return this._password; }
        set
        {
            this._LastName = value;
            OnPropertyChanged("LastName");
            OnPropertyChanged("FirstNameView");
        }
    }
    public string FirstNameView
    {
        get { return this.FirstName; }
    }
    public string LastNameView
    {
        get { return this.LastName; }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    private void OnPropertyChanged(string propertyName) { /*...*/ }
}

PeopleViewSampleData.xaml:

<sample:People xmlns:sample="clr-namespace:MyProgram">
    <sample:Person FirstNameView="John" LastNameView="Doe" />
</sample:People>  

EDIT, SOLUTION:
Having ItemSource, DataContext, and :DataContext setup as follows made it work. If any of that was missing, nothing would show.

<ListView ItemsSource="{Binding}"
          DataContext="{Binding}"
          d:DataContext="{d:DesignData Source=/SampleData/PeopleListViewSampleData.xaml}"/>

Answer 1

I don’t think you need to set DataContext on the people list view AND set the ItemsSource. Get rid of the DataContext={Binding}. Not sure if this will solve your Design problem or not. In general its usually a good idea to use the d:DesignData and d:DesignInstance properties for this though. Here is a tutorial:
http://karlshifflett.wordpress.com/2009/10/28/ddesigninstance-ddesigndata-in-visual-studio-2010-beta2/