WP7 - 使用列表框动态创建 PivotItem答案

【问题标题】：WP7 - dynamic creation of PivotItem with listboxWP7 - 使用列表框动态创建 PivotItem
【发布时间】：2011-09-17 06:27:04
【问题描述】：

我在 MainPage.xaml 中有这段代码：

<controls:PivotItem Header="first">
    <ListBox x:Name="MyListBox" Margin="0,0,-12,0" ItemsSource="{Binding ListBoxItem}">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal" Height="132">
                    <TextBlock Text="{Binding text}" />
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
</controls:PivotItem>

我需要在运行时使用这样的模型创建 N 个 PivotItem。我该怎么做？

【问题讨论】：

标签： xaml windows-phone-7 listbox pivot

【解决方案1】：

让您的 PivotItem delaration 成为静态资源。

<UserControl.Resources>

<DataTemplate x:Key="MyPivotItemTemplate">
   <controls:PivotItem Header="first" >
                <ListBox x:Name="MyListBox" Margin="0,0,-12,0" ItemsSource="{Binding ListBoxItem}">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal" Height="132">
                                <TextBlock Text="{Binding text}" />
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </controls:PivotItem>
</DataTemplate>

</UserControl.Resources>

然后在您的 Pivot 声明中将其用作您的项目的模板。

<Pivot .... ItemsTemplate="{StaticResource MyPivotItemTemplate}" Items="{Binding MyCollectionInDataContext}"

这样，每次您向MyCollectionInDataContext 添加内容时，都会根据您定义的模板创建一个PivotItem。

【讨论】：

【解决方案2】：

我今天实际上做了类似的事情。您可以将DataTemplate 模型应用于PivotItem 和PivotItem 中出现的ListBox。试试这个：

<controls:Pivot Name="PivotControl" ItemsSource="{Binding PivotItemBinding}">
    <controls:Pivot.HeaderTemplate>
        <DataTemplate>
            <TextBlock Text="Put your header bindings here"/>
        </DataTemplate>
     </controls:Pivot.HeaderTemplate>
     <controls:Pivot.ItemTemplate>
        <DataTemplate>
            <ListBox ItemsSource="{Binding ListBoxItem}">
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal" Height="132">
                          <TextBlock Text="{Binding text}" />
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
           </ListBox>
       </DataTemplate>
   </controls:Pivot.ItemTemplate>
</controls:Pivot>

在此代码中，将为您绑定到它的每个项目创建一个 PivotItem，并且其对应的 ListBox 将使用来自同一 ItemSource 中的集合的数据填充。

【讨论】：

【解决方案3】：

有一种比定义UserControl 并找出其绑定更简单的方法...

这里的大部分复杂性在于 ItemTemplate - 将 ItemTemplate 移动到该页面的 ResourceDictionary 并将其应用于所有列表框。如果您在许多页面/控件中使用模板，您甚至可以将模板移动到 App.xaml。

<phone:PhoneApplicationPage.Resources>
...
    <DataTemplate x:Key="MyItemDataTemplate">
        <StackPanel Orientation="Horizontal" Height="132">
            <TextBlock Text="{Binding text}" />
        </StackPanel>
    </DataTemplate>
...
</phone:PhoneApplicationPage.Resources>

在设计时，您只需在每个数据透视项中调用它：

<controls:PivotItem Header="first">
    <ListBox x:Name="MyListBox" 
      Margin="0,0,-12,0" 
      ItemsSource="{Binding ListBoxItems}"
      ItemTemplate="{StaticResource MyItemDataTemplate}"/>
</controls:PivotItem>
<controls:PivotItem Header="second">
    <ListBox x:Name="MyListBox2" 
      Margin="0,0,-12,0" 
      ItemsSource="{Binding OtherListBoxItems}"
      ItemTemplate="{StaticResource MyItemDataTemplate}"/>
</controls:PivotItem>

如果您需要在运行时从代码中执行此操作，您可以从页面的 ResourceDictionary 中提取“MyItemDataTemplate”ItemTemplate 对象并将其应用于您创建的新 ListBox。

【讨论】：

【解决方案4】：

首先我创建了一个用户控件

用户控制

 <UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="600" d:DesignWidth="480" Background="Transparent">

 <Grid x:Name="LayoutRoot" Background="Transparent">

        <ListBox x:Name="listUser" Margin="20,0,0,0" ScrollViewer.VerticalScrollBarVisibility="Visible"/>

</Grid>

         </UserControl>

在 xaml 之后

.cs

                pivotItem = new PivotItem();
                pivotItem.Header = "Pivot";

                UserControl user = new UserControl();
                user.DataContext = list;
                user.listUser.ItemsSource = list;

                pivotItem.Content = null;
                pivotItem.Content = user;
                pivotfather.Items.Add(pivotItem);

【讨论】：