动态添加用户控件

Question

你好stackoverflowers。

我想在屏幕上动态显示一些元素。我有一个OverlayElement基类和一些子类。OverlayElement基类包含一个FrameworkElement，它对应于一个定义如何绘制OverlayElement的小用户控件。

我有一个包含OverlayElements集合的OverlayViewModel，绑定到视图中的Itemcontrol。

以下是OverlayElement和一个孩子的摘录。

public abstract class OverlayElement : INotifyPropertyChanged
{
  public UserControl View;
}


public class ImageOverlayElement : OverlayElement
{
     public ImageOverlayElement(Point start, Point end)
     {
        View = new ImageOverlayElementView();
     }
}

下面是ImageOverlayElementView的一个示例

<UserControl x:Class="Client.ImageOverlayElementView"
             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" 
             xmlns:local="clr-namespace:Client"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300"
             d:DataContext="{d:DesignInstance local:ImageOverlayElement}">
    <Grid>
            <Image 
                Source="{Binding ImageSource}"
                Height="{Binding Height}"
                Width="{Binding Width}"/>
    </Grid>
</UserControl>

这就是我尝试使用这些元素的方式。我的问题是我不知道如何从OverlayElement插入我的UserControl视图(在子类中初始化)：

<ItemsControl
         ItemsSource="{Binding OverlayElementsList}"
         Background="Transparent">

 <ItemsControl.ItemsPanel>
      <ItemsPanelTemplate>
         <Canvas/>
      </ItemsPanelTemplate>
 </ItemsControl.ItemsPanel>

 <ItemsControl.Resources>

    <DataTemplate DataType="{x:Type elements:OverlayElement}">
       <!-- Need help for here, how can I insert my UserControl View from OverlayElement ? (initialized in the child class) -->
    </DataTemplate>

 </ItemsControl.Resources>   
</ItemsControl>

Answer 1

您可以简单地将视图放在ContentControl中

<DataTemplate DataType="{x:Type local:OverlayElement}">
    <ContentControl Content="{Binding View}" />
</DataTemplate>

但是要确保View是一个属性，否则它将不能与数据绑定一起工作。