如何在wp8中设置ListPicker的完整标题模板

时间:2014-04-11 06:19:46

标签: c# windows-phone-8

我使用下面的代码为listpicker附加完整的标题模板,但我得到了例外。

<toolkit:ListPicker x:Name="lspTranslationLang" ExpansionMode="FullScreenOnly"
                                        SelectedItem="{Binding Name, Mode=TwoWay}" SelectionChanged="lspTranslationLang_SelectionChanged">
                            <toolkit:ListPicker.FullModeHeader>
                                <DataTemplate>
                                    <TextBlock FontWeight="Bold" Foreground="Black" Text="Select Translation"></TextBlock>
                                </DataTemplate>
                            </toolkit:ListPicker.FullModeHeader>
                            <toolkit:ListPicker.HeaderTemplate>
                                <DataTemplate>
                                    <StackPanel>
                                        <TextBlock FontWeight="Bold" Foreground="Black" Text="Select Translation"></TextBlock>
                                    </StackPanel>
                                </DataTemplate>
                            </toolkit:ListPicker.HeaderTemplate>
                            <toolkit:ListPicker.ItemTemplate>
                                <DataTemplate>
                                    <StackPanel>
                                        <TextBlock FontSize="30" Text="{Binding Language}" />
                                    </StackPanel>
                                </DataTemplate>
                            </toolkit:ListPicker.ItemTemplate>
                            <toolkit:ListPicker.FullModeItemTemplate>
                                <DataTemplate>
                                    <Grid Margin="0" Background="White">
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto"></RowDefinition>
                                            <RowDefinition Height="*"></RowDefinition>
                                        </Grid.RowDefinitions>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                                            <ColumnDefinition Width="*"></ColumnDefinition>
                                        </Grid.ColumnDefinitions>

                                        <Image Grid.Row="0" Margin="10,0,0,0" Width="30" Height="30" Grid.Column="0" Source="{Binding ImagePath}" ></Image>
                                        <TextBlock Grid.Row="0" Padding="10,0,10,0" Grid.Column="1" Foreground="Black" Text="{Binding Language}" FontSize="30"/>
                                        <TextBlock Grid.Row="1" Padding="10,0,10,0" Grid.Column="1" Foreground="Black" Text="{Binding Description}" FontSize="30"/>

                                        <Line X1="0" X2="480" Y1="0" Y2="0" Grid.Row="1" Grid.ColumnSpan="2" VerticalAlignment="Bottom" StrokeThickness="1" Stroke="LightGray" />
                                        </Grid>

                                </DataTemplate>
                            </toolkit:ListPicker.FullModeItemTemplate>

                        </toolkit:ListPicker>

例外:

{System.InvalidCastException: Unable to cast object of type 'System.Windows.DataTemplate' to type 'System.String'.

如果删除FullHeaderTemplate,则没有例外。

如何修改listpicker的完整标题模板?

谢谢!

1 个答案:

答案 0 :(得分:0)

我认为FullModeHeader只是标题。你真正想要的是FullModeItemTemplate。见下面的例子:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
    <Grid.Resources>
        <DataTemplate x:Name="PickerFullModeItemTemplate">
            <TextBlock Margin="0, 10, 0, 0" Style="{StaticResource PhoneTextGroupHeaderStyle}" Text="{Binding ItemText}"></TextBlock>
        </DataTemplate>
    </Grid.Resources>
    <ScrollViewer>
        <Grid>
            <TextBlock Style="{StaticResource PhoneTextGroupHeaderStyle}" TextWrapping="Wrap">Choose an option to group the list of task</TextBlock>
            <TextBlock Style="{StaticResource PhoneTextGroupHeaderStyle}" Foreground="Aqua" Margin="12,100,0,0" Name="OptionText" Text="Current Option:"></TextBlock>
            <toolkit:ListPicker ExpansionMode="FullScreenOnly" FullModeHeader="Choose an option" SelectionMode="Single"  FullModeItemTemplate="{StaticResource PickerFullModeItemTemplate}" Name="GroupingPicker" Header="Choose grouping option" Margin="12,150,12,0"></toolkit:ListPicker>
        </Grid>
    </ScrollViewer>
</Grid>