如何为 ListBox 创建不同的 ItemsPanelTemplate [英] How to create different ItemsPanelTemplate for a ListBox

问题描述

我正在 Windows Phone 8 上编写 IM 程序.我目前正在处理用于聊天的 UI.我想创建一个 ListBox 来保存所有的聊天气泡"(就像 iPhone 中的那些).传入消息显示在左侧，传出消息显示在右侧.像这样:

I'm writing an IM program on Windows Phone 8. And I am currently dealing with the UI for chatting. I want to create a ListBox that holds all the "chat bubbles" (like those in iPhone). The incoming messages appear on the left-hand side, and outgoing messages on the right-hand side. Like this:

很明显，我需要为每个项目设置不同的对齐.

So obviously, I need to set differnt alignment for each item.

我试图通过将气泡包裹在一个大的 Grid 中来解决这个问题，它扩展了 ItemsPanel 中的所有空间，并将聊天气泡向右对齐(聊天气泡的父级是大 Grid).但这不起作用，因为 ItemsPanel 中的网格不会自动填充所有空间.然后我去搜索如何填充 ItemsPanel 中的所有空格"，但没有成功.

I was trying to solve this by wrapping the bubble in a large Grid that expands all the space in the ItemsPanel, and align the chat bubble to the right (the parent of the chat bubble is the large Grid). But that didn't work because a grid in ItemsPanel won't fill up all the spaces automatically. And then I went for searching "how to fill up all spaces in ItemsPanel" and no luck.

所以，我认为唯一的方法是为每个 ItemsPanel 设置不同的 ItemsPanelTemplate 为右"或左".

So, I think the only way to do this is to set different ItemsPanelTemplate for each ItemsPanel, to either "Right" or "Left".

请帮帮我..谢谢！

那么如何为不同的 ItemsPanelTemplate 创建选择器?

So how do you create a selector for different ItemsPanelTemplate?

推荐答案

你只需要自定义 itemContainer :

You just need to customize the itemContainer :

<ItemsControl.ItemContainerStyle>
    <Style TargetType="ContentPresenter">
        <Style.Triggers>
            <DataTrigger Binding="{Binding IsAnswer}" Value="True">
                <Setter Property="HorizontalAlignment" Value="Right"/>
            </DataTrigger>
        </Style.Triggers>
    </Style>
</ItemsControl.ItemContainerStyle>

如果您没有样式触发器，您可以使用绑定和 bool 到 Horizo​​ntalAlignment 转换器:

In case you dont have style triggers, you can use binding and a bool to HorizontalAlignment converter :

<ItemsControl.ItemContainerStyle>
    <Style TargetType="ContentPresenter">
        <Setter Property="HorizontalAlignment" Value="{Binding IsAnswer,Converter={StaticResource AlignmentConverter}}"/>
    </Style>
</ItemsControl.ItemContainerStyle>

这篇关于如何为 ListBox 创建不同的 ItemsPanelTemplate的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！