2
votes

I have a Listpicker control in a page that I bind some items against and I'm trying to change the item template.

My template look as follows:

<phone:PhoneApplicationPage.Resources>
    <DataTemplate x:Name="modulePickerFullItemTemplate">
        <StackPanel>
            <TextBlock Text="{Binding modes}"/>
        </StackPanel>
    </DataTemplate>
    <DataTemplate x:Name="modulePickerItemTemplate">
        <StackPanel Orientation="Horizontal">
            <TextBlock Text="LALA" Foreground="#333"/>
            </StackPanel>
        </DataTemplate>
</phone:PhoneApplicationPage.Resources>

The Listpicker:

<toolkit:ListPicker x:Name="ddlMode" Grid.Row="6" ExpansionMode="FullScreenOnly"
                    FullModeItemTemplate="{Binding modulePickerFullItemTemplate}" 
                    ItemTemplate="{Binding modulePickerItemTemplate}"  
                    FullModeHeader="Select mode">
</toolkit:ListPicker>

What I see in the item is the value that I bind against the Listpicker, not the LALA value that I would expect.

Anything I'm doing wrong?

2

2 Answers

7
votes

You've used

ItemTemplate="{Binding modulePickerItemTemplate}"

in your first code snippet, but it must be

ItemTemplate="{StaticResource modulePickerItemTemplate}"

You should use "Binding" to access data binded to the control and "StaticResource" to access everything you've defined in the Resources like the DataTemplate.

2
votes

This is what I ended up with, to fix the problem:

<toolkit:ListPicker x:Name="lst"
                    ExpansionMode="FullScreenOnly"
                    FullModeHeader="Select">
    <toolkit:ListPicker.ItemTemplate>
        <DataTemplate>
            <Image Source="{Binding Image}" Stretch="None"></Image>
        </DataTemplate>
    </toolkit:ListPicker.ItemTemplate>
    <toolkit:ListPicker.FullModeItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding Name}"/>
            </StackPanel>
        </DataTemplate>
    </toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>