如何在 UserControl 中允许多个孩子？答案

【问题标题】：How do you allow multiple children in a UserControl?如何在 UserControl 中允许多个孩子？
【发布时间】：2013-02-26 21:42:32
【问题描述】：

我有以下用户控制：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
<Label Grid.Row="0" Content="USER CONTROL" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" Name="label1" 
       VerticalAlignment="Top" FontSize="26" Padding="0"/>        
<ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled">
    <Border BorderBrush="Black" BorderThickness="1">
        <DockPanel x:Name="dPanel" Background="White">            
        </DockPanel>
    </Border>
</ScrollViewer>        
</Grid>

当我在 MainWindow.xaml 中使用以下 XAML 时：

<local:UserDockPanel>
    <Label ...>
    <Label ...>
</local:UserDockPanel>

上面说我不能生一个以上的孩子。

我的第一个问题是：我应该使用 UserControl 还是应该使用自定义控件？我认为 UserControl 最适合我在 DockPanel 上有标签、Border 和 Scrollviewer 的情况。

另外，据我了解，面板无法模板化。它没有外观，因此没有风格。

第二个问题：如果我应该使用 UserControl，我怎样才能让它允许将多个孩子添加到停靠面板中？

【问题讨论】：

标签： c# wpf user-controls dockpanel

【解决方案1】：

您可以使用 ItemsControl 做到这一点，无需继承任何东西或创建自己的：

<Window x:Class="WpfApplication4.Window16"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window16" Height="300" Width="300">
    <Window.Resources>
        <Style TargetType="ItemsControl" x:Key="UserDockPanelStyle">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ItemsControl">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <Label Grid.Row="0" Content="USER CONTROL" HorizontalAlignment="Stretch" HorizontalContentAlignment="Center" Name="label1" 
                                                VerticalAlignment="Top" FontSize="26" Padding="0"/>
                            <ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Disabled">
                                <Border BorderBrush="Black" BorderThickness="1">
                                    <ItemsPresenter/>
                                </Border>
                            </ScrollViewer>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="ItemsPanel">
                <Setter.Value>
                    <ItemsPanelTemplate>
                        <DockPanel IsItemsHost="True" Background="White"/>
                    </ItemsPanelTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <ItemsControl Style="{StaticResource UserDockPanelStyle}">
        <Label DockPanel.Dock="Bottom" Content="Bottom"/>
        <Label DockPanel.Dock="Top" Content="Top"/>
        <Border Background="Blue"/>
    </ItemsControl>
</Window>

【讨论】：

这太完美了！无论如何我可以让你解释一下这里发生了什么？我了解其中一些，但是，我真的很想知道这是如何工作的。
您正在为ItemsControl 创建一个自定义ControlTemplate，然后将其ItemsPanelTemplate 设置为DockPanel。