2012-12-28 14:44:50
Well, I am not sure if this is what you want achieve but here is a way that you can try:
 
Assuming your classes are like these:
 
public class Group
{
    public string Name { get; set; }
    public List<Contact> Contacts { get; set; }
}
 
public class Contact
{
    public string Name { get; set; }
    public bool IsOnline { get; set; }
}
You can set ListBox.ItemTemplate as another ListBox bind to Contacts property, like:
 
<CollectionViewSource x:Key="groups" Source="{Binding}" >
    <CollectionViewSource.GroupDescriptions>
        <PropertyGroupDescription PropertyName="Name" />
    </CollectionViewSource.GroupDescriptions>
</CollectionViewSource>
 
<DataTemplate x:Key="groupTemplate" DataType="Group">
    <StackPanel Orientation="Horizontal">
        <TextBlock Text="{Binding Name}" />
    </StackPanel>
</DataTemplate>
 
<ListBox ItemsSource="{Binding Source={StaticResource groups}}">
    <ListBox.GroupStyle>
        <GroupStyle HeaderTemplate="{StaticResource groupTemplate}" />
    </ListBox.GroupStyle>
    <ListBox.ItemTemplate>
        <DataTemplate DataType="Contact">
            <ListBox ItemsSource="{Binding Contacts}">
                <ListBox.ItemTemplate>
                    <DataTemplate DataType="Contact">
                        <TextBlock Text="{Binding Name}" />
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>
You have to style the inner listbox a little bit.
 
Edit: Another solution by using TreeView
 
<DataTemplate DataType="Contact">
   <TextBlock Text="{Binding Name}" />
</DataTemplate>
 
<TreeView ItemsSource="{Binding Source={StaticResource groups}}">
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate DataType="Group" ItemsSource="{Binding Contacts}">
            <TextBlock Text="{Binding Name}" />
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>
share|edit|flag
edited May 22 '09 at 9:05
 
answered May 22 '09 at 7:25
 
idursun
2,7361320
 
 
This is quiet helpful and equal to my old solution, where I had an Expander per group and a ListBox for the Contacts. The problem here is, that you can select a person per list, but I supposed you can do it with one. I try to copy the UI of the Windows Live Messenger 2009 contact list. I think they used only one ListBox and an Expander as ControlTemplate for the group. But I also assume, they defined the group as property. But I really don't know, how they can count the online persons. By the way, you are right with your classes. – user110918 May 22 '09 at 8:01
 
 
Why don't you use TreeView control for displaying hierarchical data? – idursun May 22 '09 at 8:24
 
 
You are absolutely right! I think, that would solve my problem for sure. I've got no answer for the "why". I haven't used the TreeView control a lot. But this would be the best for my problem. Thanks! – user110918 May 22 '09 at 9:01
 
 
I edited my answer with a TreeView example. – idursun May 22 '09 at 9:06
 
 
TreeView was really that what I needed. – user110918 May 22 '09 at 9:35
Invalid Email or Password