以编程方式处理在xaml中创建的canvas

我正在使用MVVM方法在WPF中创建应用程序。 我对这个主题相当新,我正在寻找如何实现以下内容的指针:我在XAML中创建了一个canvas,如下所示:

 ...  

我在XAML中添加了一个按钮,我想用鼠标单击将(编程)一些基本形状(线条,矩形等)绘制到现有canvas上。 由于我使用的是MVVM方法,因此按钮的命令必须绑定到方法,如下所示:

  

我得到绑定本身工作正常,我在C#中创建了图形和形状,但我不明白如何将形状放在XAML中创建的canvas上。 如何从我的方法中解决在XAML中预先制作的canvas? 我该怎么做?

编辑:

关键是我想基于数据生成形状以使其可视化。 所以,如果我的输入有3个A类元素,我想创建3个矩形并在canvas上显示它们。 后来我想让它们可点击并在点击时显示一些关于它们的信息。 MVVM是我的一套要求。

在视图模型中,您应该具有不使用任何UI元素的形状的表示:

 public class ShapeItem { public Geometry Geometry { get; set; } public Brush Fill { get; set; } public Brush Stroke { get; set; } } public class ViewModel { public ObservableCollection ShapeItems { get; set; } } 

然后,您将使用带有相应ItemsPanelItemTemplate的ItemsControl来可视化形状项:

             

可以如下所示初始化视图模型,并且在执行适当的命令方法时可以类似地添加项目:

 var vm = new ViewModel(); vm.ShapeItems = new ObservableCollection(); vm.ShapeItems.Add( new ShapeItem { Geometry = new EllipseGeometry(new Point(100, 100), 100, 50), Fill = Brushes.LightBlue }); vm.ShapeItems.Add( new ShapeItem { Geometry = new RectangleGeometry(new Rect(150, 100, 200, 100)), Fill = Brushes.Azure, Stroke = Brushes.Black }); DataContext = vm;