Question

In my model I have class:

public class Heaviness
{
    public int ID {get; set;}
    public string NameToDisplay {get; set;}
}

in my view model I have a property HeavinessList:

public ObservableCollection<Heaviness> HeavinessList {get;set;}

In my xaml I added ListPicker with items source binded to HeavinessList; its data template for item is binded to NameToDisplay property of Heaviness object.

<StackPanel x:Name="HeavinessGroup" Width="220" HorizontalAlignment="Left">
    <TextBlock x:Name="HeavinesLabel" Margin="12,0,0,0" TextWrapping="Wrap" 
               Text="Heaviness:" HorizontalAlignment="Left"/>
    <toolkit:ListPicker x:Name="HeavinessListPicker" 
                        SelectedIndex="0"
                        ItemsSource="{Binding HeavinessList}"
                        VerticalAlignment="Center">
        <DataTemplate>
            <TextBlock Text="{Binding NameToDisplay}" />
        </DataTemplate>
    </toolkit:ListPicker>
</StackPanel>

However, when I run the app I got the object name displayed instead of property. Why does it happen?

Answer 1

You need to assign your DataTemplate to the ItemTemplate property and don’t put it directly into the ListPicker:

<toolkit:ListPicker x:Name="HeavinessListPicker" 
                        SelectedIndex="0"
                        ItemsSource="{Binding HeavinessList}"
                        VerticalAlignment="Center">
    <toolkit:ListPicker.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding NameToDisplay}" />
        </DataTemplate>
    </toolkit:ListPicker.ItemTemplate>
</toolkit:ListPicker>

You can read more about DataTemplates on MSDN (the article is about WPF but the same concepts apply for WP7)