How do I allow multiple items/content for a user control in WPF?

Question

I've managed to get as far as redirecting content to my stackpanel as shown:

<UserControl 
x:Name="taskItem">
<UserControl.ContentTemplate>
    <DataTemplate>
        <StackPanel>
            <Label x:Name="labelHeader" Content="{Binding ElementName=taskItem,Path=Header}" FontFamily="Tahoma" FontSize="16" FontWeight="Bold" />
            <Border BorderThickness="0,1,0,0" BorderBrush="#999999" Margin="5,0,5,0">
                <StackPanel Margin="10,5,0,0">
                    <ContentPresenter Content="{TemplateBinding Content}" />
                </StackPanel>
            </Border>
        </StackPanel>
    </DataTemplate>
</UserControl.ContentTemplate>

I'm trying to create a control that has a header, a line under it, and then N number of child contents. However, in it's current implementation it won't allow more than one.

What am I doing wrong here?

Answer 1

A user control by definition has one child since it inherits from ContentControl. Make the user control have all the headers and then make ItemsControl the content of the UserControl. Apply your DataTemplate to the ItemTemplate property of the ItemsControl.

    <UserControl x:Class="WindowsApplication1.UserControl1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"&gt;
    <Grid>
      <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
      </Grid.RowDefinitions>
      <Grid Name="MainHeadersGrid" Grid.Row="0">
        <TextBlock Text="Put your headers here" />
      </Grid>

      <ItemsControl Name="childItemsWillGoInHere"  ItemsSource="{Binding}" Grid.Row="1">
        <ItemsControl.ItemTemplate>
          <DataTemplate>
            <TextBlock Text="{Binding PropertyOfItem}" />
          </DataTemplate>
        </ItemsControl.ItemTemplate>
      </ItemsControl>

    </Grid>
</UserControl>

Now, assign the UserControl's template's DataContext to a collection of the objects you want to display.