在列表框中加入分隔符

Question

我需要在我的ListBoxItems中加入分隔符，例如一些项目在分隔符下方，一些在上方。

例如： 这可以通过修改ListBox的ControlTemplate来实现。

 <ScrollViewer>
     <StackPanel>
         <ItemsPresenter />                                        
         <Separator  BorderBrush="Red"  />
         <ListBoxItem Content=".." ContentTemplate="..."  x:Key="helpItem"/>                                    
     </StackPanel>
 </ScrollViewer>

问题在于“helpItem”没有被选中，因为它不是我的ItemsSource的一部分。

暂时能够选择它就足够了。

1）那么我的第一个问题是如何将此项目与我的ItemsSource相关联，或者使其可选择？

此外，在将来，我可能希望有更多的项目放置在我的列表框的下半部分。

2）如何在给定位置物理地放置分隔符，以在逻辑上分隔我的ItemsPresenter？

- eran otzap

---

我以前也遇到过这个问题。我将多个列表框堆叠在一起，并设置它们的边框，使其看起来像一个单独的列表框，但在表面下，每个列表框都有自己的项目来源。唯一棘手的部分是协调选择手势，以便最终用户“体验”只看到一个项目被选中。 - Gayot Fow

有点想避免那个 :) - eran otzap

如果您想要使用单个控件，仍然有一个解决方案：从VirtualizingStackPanel派生一个类，并为其实现自己的ItemsControlGenerator。我以前也做过这个，可以证明它会给你想要的东西。不过，缺点是编写ICG可能并不是完全愉快的经历。 :) - Gayot Fow

Answer 1

如果您将集合分成基于需要多少分隔符的“n”个小组，而不是使用多个ListBox控件，则可以通过CompositeCollection将它们全部放在同一个ListBox中。这样可以使内容更加通俗易懂。

例如，假设我有：

public partial class MainWindow : Window {
  public List<string> CollA { get; set; }
  public List<string> CollB { get; set; }
  public MainWindow() {
    InitializeComponent();

    CollA = new List<string> {"A", "B", "C"};

    CollB = new List<string> {"D", "E", "F"};

    DataContext = this;
  }
}

我希望在CollA和CollB之间添加分隔符，这样我的xaml代码会变成:

<ListBox>
  <ListBox.Resources>
    <CollectionViewSource x:Key="CollectionOne"
                          Source="{Binding CollA}" />
    <CollectionViewSource x:Key="CollectionTwo"
                          Source="{Binding CollB}" />
  </ListBox.Resources>
  <ListBox.ItemsSource>
    <CompositeCollection>
      <CollectionContainer Collection="{Binding Source={StaticResource CollectionOne}}" />
      <ListBoxItem HorizontalContentAlignment="Stretch"
                    IsEnabled="False"
                    IsHitTestVisible="False">
        <Rectangle Height="2"
                    Fill="Gray" />
      </ListBoxItem>
      <CollectionContainer Collection="{Binding Source={StaticResource CollectionTwo}}" />
    </CompositeCollection>
  </ListBox.ItemsSource>
</ListBox>

应该会产生以下结果：

现在项目是可用的，您可以将SelectedItem绑定并按照您的需求进行操作。同时，通过检查选定的项与源集合的对比，您可以检测当前所选项属于哪个源列表。

- Viv

---

听起来不错，我会试一下。 - eran otzap