c# - 如何通过用户的 XAML 将控件动态添加到 UserControl？

Question

我想创建一个包含 TextBlock 和 StackPanel 的用户控件，允许用户在 XAML 中动态地将他/她自己的控件添加到用户控件。

这是我的用户控件的示例 XAML:

<UserControl x:Class="A1UserControlLibrary.UserControlStackPanel"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="200" d:DesignWidth="300">
    <StackPanel>
        <TextBlock Text="I want the user to be able to add any number of controls to the  StackPanel below this TextBlock."
                   FontFamily="Arial" FontSize="12" FontWeight="DemiBold" Margin="5,10,5,10" TextWrapping="Wrap"/>
        <StackPanel>
            <!-- I want the user to be able to add any number of controls here -->
        </StackPanel>
    </StackPanel>
</UserControl>

我希望用户能够将此用户控件嵌入到他们的 XAML 中，并将他们自己的控件添加到用户控件的堆栈面板中:

<uc:A1UserControl_StackPanel x:Name="MyUserControl_Test" Margin="10" Height="100">
    <Button Name="MyButton1" Content="Click" Height="30" Width="50"/>
    <Button Name="MyButton2" Content="Click" Height="30" Width="50"/>
    <Button Name="MyButton3" Content="Click" Height="30" Width="50"/>
</uc:A1UserControl_StackPanel>

使用上述 XAML 执行此操作不起作用。有什么想法吗？

Answer 1

您可以做到这一点，尽管完全不像您的例子。你需要两件事。第一种是声明类型为 UIElement 的 DependencyProperty，所有控件都扩展为:

public static DependencyProperty InnerContentProperty = DependencyProperty.Register("InnerContent", typeof(UIElement), typeof(YourControl));

public UIElement InnerContent
{
    get { return (UIElement)GetValue(InnerContentProperty); }
    set { SetValue(InnerContentProperty, value); }
}

第二个是在您希望内容出现的 XAML 中声明一个 ContentControl:

<StackPanel>
    <TextBlock Text="I want the user to be able to add any number of controls to the  StackPanel below this TextBlock."
               FontFamily="Arial" FontSize="12" FontWeight="DemiBold" Margin="5,10,5,10" TextWrapping="Wrap"/>
    <StackPanel>
        <ContentControl Content="{Binding InnerContent, RelativeSource={RelativeSource AncestorType={x:Type YourXmlNamspacePrefix:ContentView}}}" />
    </StackPanel>
</StackPanel>

在我看来，如果您使用 StackPanel，您可能会发现您的内容无法正确显示...我建议您使用 Grid 用于除了最简单的布局任务之外的所有布局目的。

现在与您的示例的一个区别在于您将如何使用您的控件。 InnerContent 属性的类型为 UIElement，这意味着它可以容纳一个 UIElement。这意味着您需要使用一个容器元素来显示多个项目，但它们具有相同的最终结果:

<YourXmlNamspacePrefix:YourControl>
    <YourXmlNamspacePrefix:YourControl.InnerContent>
        <StackPanel x:Name="MyUserControl_Test" Margin="10" Height="100">
            <Button Content="Click" Height="30" Width="50"/>
            <Button Content="Click" Height="30" Width="50"/>
            <Button Content="Click" Height="30" Width="50"/>
        </StackPanel>
    </YourXmlNamspacePrefix:YourControl.InnerContent>
</YourXmlNamspacePrefix:YourControl>

结果:

---

更新>>>

郑重声明，我完全知道您想做什么。看来你不明白我在说什么，所以我会尝试为你解释最后一次。添加一个 Button 并设置了 Tag 属性，正如我已经向您展示的那样:

<Button Tag="MyButton1" Content="Click" Click="ButtonClick" />

现在添加一个 Click 处理程序:

private void ButtonClick(object sender, RoutedEventArgs e)
{
    Button button = (Button)sender;
    if (button.Tag = "MyButton1") DoSomething();
}

仅此而已。