Windows Phone 8中具有多个ItemTemplates的ListBox

Question

Windows Phone 8中具有多个ItemTemplates的ListBox

4

我有一个ListBox，它是一组会话气泡（例如消息应用程序），每个气泡都可以来自用户或系统。因此，列表框中定义了两个数据模板，并存储在资源中。如何有选择性地将它们应用到ListBox上？

我尝试使用DataTemplateSelector(这是WP7的解决方案，但是在WP8中找不到该类！)、使用DataType属性(在WP8中不受支持)，最终是在ItemTemplate属性上使用IValueConvertor, 但是所有尝试都失败了！

有什么方法可以实现吗？我想象中一定有办法，因为这是一个相对简单的需求。

谢谢。

- Javawag

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- JustinAngel · Accepted Answer

DataTemplateSelector 是在XAML数据绑定中根据项目类型更改 ItemTemplates 的推荐方法。WP7没有内置 DataTemplateSelector ，WP8也没有内置。您需要在网上找到您喜欢的DataTemplateSelector版本并使用它，或者只需编写自己的版本，因为它只需要大约5-10行代码。

WindowsPhoneGeek 上有一篇关于自定义 WP7 中的 DataTemplateSelectors 的好文章，wp7nl 项目则基于该文章构建了DataTemplateSelector 基类。

<ListBox x:Name="listBox" HorizontalContentAlignment="Stretch">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <local:FoodTemplateSelector Content="{Binding}">
                <local:FoodTemplateSelector.Healthy>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal" Background="YellowGreen" Width="400" Margin="10">
                            <Image Source="{Binding IconUri}" Stretch="None"/>
                            <TextBlock Text="{Binding Name}" FontSize="40" Foreground="Black" Width="280"/>
                            <TextBlock Text="healty" />
                        </StackPanel>
                    </DataTemplate>
                    </local:FoodTemplateSelector.Healthy>
                <local:FoodTemplateSelector.UnHealthy>
                    <DataTemplate>
                        <Border BorderBrush="Red" BorderThickness="2"  Width="400" Margin="10">
                        <StackPanel Orientation="Horizontal">
                            <Image Source="{Binding IconUri}" Stretch="None"/>
                                <TextBlock Text="{Binding Name}" FontSize="40" Width="280"/>
                            <Image Source="Images/attention.png" Stretch="None" Margin="10,0,0,0"/>
                        </StackPanel>
                        </Border>
                    </DataTemplate>
                </local:FoodTemplateSelector.UnHealthy>
                <local:FoodTemplateSelector.NotDetermined>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal" Background="Gray" Width="400" Margin="10">
                            <Image Source="{Binding IconUri}" Stretch="None"/>
                            <TextBlock Text="{Binding Name}" FontSize="40" Width="280"/>
                            <Image Source="Images/question.png" Stretch="None" Margin="10,0,0,0"/>
                        </StackPanel>
                    </DataTemplate>
                </local:FoodTemplateSelector.NotDetermined>
            </local:FoodTemplateSelector>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

如果您正在寻找更快速且简单的解决方案，Prism的DataTemplateSelector不需要编写C#代码，因为它使用DataTemplateSelector.Resources集合来处理类型映射。两个DataTemplateSelector类可以直接复制并在您的应用程序中使用。

   1: <UserControl.Resources>
   2:     <DataTemplate x:Key="SelectorDataTemplate">
   3:         <prism:DataTemplateSelector Content="{Binding}"
   4:                                     HorizontalContentAlignment="Stretch"
   5:                                     IsTabStop="False">
   6:             <prism:DataTemplateSelector.Resources>
   7:                 <DataTemplate x:Key="DataType1">
   8:                     <StackPanel Orientation="Horizontal">
   9:                         <TextBlock Text="{Binding ID}"/>
  10:                         <toolkit:Separator />
  11:                         <TextBlock Text="{Binding Name}" />
  12:                     </StackPanel>
  13:                 </DataTemplate>
  14:  
  15:                 <DataTemplate x:Key="DataType2">
  16:                     <StackPanel Orientation="Horizontal">
  17:                         <TextBox Text="{Binding Index}" />
  18:                         <toolkit:Separator />
  19:                         <TextBox Text="{Binding Description}" />
  20:                     </StackPanel>
  21:                 </DataTemplate>
  22:  
  23:             </prism:DataTemplateSelector.Resources>
  24:         </prism:DataTemplateSelector>
  25:     </DataTemplate>
  26: </UserControl.Resources>

还有许多其他的 DataTemplateSelectors，包括：Odyssey Phone，UIMessage 等等。