Silverlight 3 – Binding POCO objects to XAML

This post has moved to http://www.scottleckie.com/2009/10/silverlight-3-%e2%80%93-binding-poco-objects-to-xaml/

Obvious, really, but I spent ages chasing down how to bind some kind of POCO to a XAML display;

<Grid x:Name="LayoutRoot">
<Grid.RowDefinitions>
<RowDefinition Height="300" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="300"/>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="auto"/>
</Grid.ColumnDefinitions>
<TextBlock Text="Name" Grid.Row="1" Grid.Column="1"/>
<TextBlock Text="Gender" Grid.Row="2" Grid.Column="1"/>
<TextBlock Text="Age" Grid.Row="3" Grid.Column="1"/>
<TextBlock Text="DOB" Grid.Row="4" Grid.Column="1"/>
<Border BorderThickness="1" BorderBrush="Black" Background="AliceBlue" CornerRadius="10" Grid.Row="1" Grid.Column="2">
<TextBlock x:Name="name" Text="{Binding Name}" Margin="5,5,5,5" />
</Border>
<Border BorderThickness="1" BorderBrush="Black" Background="AliceBlue" CornerRadius="10" Grid.Row="2" Grid.Column="2">
<TextBlock x:Name="gender" Text="{Binding Gender}" Margin="5,5,5,5" />
</Border>
<Border BorderThickness="1" BorderBrush="Black" Background="AliceBlue" CornerRadius="10" Grid.Row="3" Grid.Column="2">
<TextBlock x:Name="age" Text="{Binding Age}" Margin="5,5,5,5" />
</Border>
<Border BorderThickness="1" BorderBrush="Black" Background="AliceBlue" CornerRadius="10" Grid.Row="4" Grid.Column="2">
<controls:DatePicker x:Name="dob" Text="{Binding DOB}" IsEnabled="False" Margin="5,5,5,5" />
</Border>
</Grid>

And I could not figure out why it was refusing to recognise the object I was passing to it. Then I found that it is impossible to bind to a data source in XAML. You need to bind the data context in code;

public partial class MainPage : UserControl
{
Person person = new Person { Name = "Scott", Gender = 'M', Age = 43, DOB=new DateTime(1966, 7, 12) };
public MainPage()
{
InitializeComponent();
LayoutRoot.DataContext = person;
}
}

Ho hum. Three hours down the drain…