You need design time data. You can declare a design-time data context using the d:DataContext property. You can create mock classes that expose mock lists for your the designer to show at design time.
<Window 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"
mc:Ignorable="d"
x:Class="WpfAnswer001.Window1"
d:DataContext="{StaticResource ResourceKey=MockMasterViewModel}"
Title="Window1" d:DesignWidth="523.5">
<Grid>
<ListBox ItemsSource="{Binding Path=Items}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="4">
<TextBlock Text="{Binding Title}" />
<TextBlock Text="{Binding Address}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Window>
This is how you declare the mock view model in App.xaml:
<Application x:Class="WpfAnswer001.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfAnswer001"
StartupUri="Window1.xaml">
<Application.Resources>
<local:MockMasterViewModel x:Key="MockMasterViewModel"/>
</Application.Resources>
</Application>
This is how the code for the mock view model looks like:
using System.Collections.ObjectModel;
public class MockItemViewModel
{
public string Title { get; set; }
public string Address { get; set; }
}
public class MockMasterViewModel
{
public ObservableCollection<MockItemViewModel> Items { get; set; }
public MockMasterViewModel()
{
var item01 = new MockItemViewModel() { Title = "Title 01", Address = "Address 01" };
var item02 = new MockItemViewModel() { Title = "Title 02", Address = "Address 02" };
Items = new ObservableCollection<MockItemViewModel>()
{
item01, item02
};
}
}
This is how it looks in Visual Studio:
Is it worth the effort and coding? That is up to you, but this is how it should be done.
Otherwise, put up with a blank designer and test only at runtime.
This is very useful when you are working a lot with Expression Blend and really need to see how the items look like.
