将集合绑定到 PivotControl 的 DataTemplate 内的列表选择器

Question

在枢轴控件内，我有一个用于 ItemTemplate 的 DataTemplate (TestItemTemplate)。页面的 DataContext 设置为 {BindingrelativeSource={RelativeSource Self}}，并且 PivotControl 的 ItemsSource 绑定到可观察集合。

在数据透视控件的 DataTemplate 内部，我有一个 ListPicker，我想将其绑定到 IEnumerable。我创建了一个公共财产 IEnumerable TestEntries = "一二三".Split();

但列表选择器不显示任何绑定项目。如果我将列表选择器放在数据模板之外（作为 PivotControl 的同级，它会显示选择器中的三个字符串）

    <phone:PhoneApplicationPage.Resources>
    <DataTemplate x:Key="TestItemTemplate">
     <Grid Margin="0,-25,0,0">         
      <Grid.RowDefinitions>
          <RowDefinition Height="Auto" x:Name="AnotherContainer" />
          <RowDefinition Height="300" x:Name="TestDescriptionContainer" />
          <RowDefinition Height="Auto" x:Name="SaveCancelDeleteContainer" />            
      </Grid.RowDefinitions>

            <toolkit:ListPicker x:Name="lstPicker" Grid.Row="0" ItemsSource="{Binding TestEntries}" Header="situation" FullModeHeader="SITUATIONS">
                <toolkit:ListPicker.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding}" Margin="4 0 0 0"/>
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.ItemTemplate>
                <toolkit:ListPicker.FullModeItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal" Margin="16 21 0 20">
                            <TextBlock Text="{Binding}" Margin="4 0 0 0" FontSize="43" FontFamily="{StaticResource PhoneFontFamilyLight}"/>
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.FullModeItemTemplate>
            </toolkit:ListPicker>   

<TextBox Grid.Row="1" Text="{Binding Description}" TextWrapping="Wrap" VerticalAlignment="Top" d:LayoutOverrides="Width" AcceptsReturn="True" Height="300"/>   

      <StackPanel Grid.Row="2" Orientation="Horizontal" HorizontalAlignment="Center" Margin="0,2,0,0" >
          <Button x:Name="SaveButton" Content="Save" Margin="5" Click="SaveButton_Click" Width="140" />
          <Button x:Name="CancelButton" Content="Cancel" Margin="5" Click="CancelButton_Click" Width="140" />
          <Button x:Name="DeleteButton" Content="Delete" Margin="5" Click="DeleteButton_Click" Width="140" />
      </StackPanel>    
     </Grid>
    </DataTemplate>   
</phone:PhoneApplicationPage.Resources>

<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
    <!--Pivot Control-->

    <controls:Pivot 
        x:Name="PivotControl"
        Title="{StaticResource AppName}" 
        ItemsSource="{Binding TestEntries}" 
        ItemTemplate="{StaticResource TestItemTemplate}"
        SelectionChanged="PivotControl_SelectionChanged"
        >
    </controls:Pivot>
</Grid>

Answer 1

我自己想出了这个办法。如果其他人遇到同样的问题，这里是解决方案。
我认为当 ListPicker 位于 DataTemplate 内时，需要正确设置 DataContext，因为在 Page 的初始化方法或加载的事件处理程序中，DataTemplate 内的 ListPicker 仍然为空。使用控件自己的 Loaded 事件处理程序对其进行初始化。

我必须在其自己的 Loaded 事件处理程序中设置 ListPicker 的 DataContext。像这样：

private void lstTestEntriesPicker_Loaded(object sender, RoutedEventArgs e)
{
    ListPicker lstTestEntriesPicker= VisualElementHelper.FindName<ListPicker>("lstTestEntriesPicker", this);
    if (lstTestEntriesPicker!= null)
    {
        lstTestEntriesPicker.DataContext = TestEntries;
    }
}

XAML 看起来像这样：

        <toolkit:ListPicker x:Name="lstTestEntriesPicker"  ItemsSource="{Binding}" Grid.Row="0" Header="TestEntries" FullModeHeader="TestEntries" Loaded="lstTestEntriesPicker_Loaded">
            <toolkit:ListPicker.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding}" Margin="4 0 0 0"/>
                    </StackPanel>
                </DataTemplate>
            </toolkit:ListPicker.ItemTemplate>
            <toolkit:ListPicker.FullModeItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" Margin="16 21 0 20">
                        <TextBlock Text="{Binding}" Margin="4 0 0 0" FontSize="43" FontFamily="{StaticResource PhoneFontFamilyLight}"/>
                    </StackPanel>
                </DataTemplate>
            </toolkit:ListPicker.FullModeItemTemplate>
        </toolkit:ListPicker>