在WPF MVVM中画布上的绘制线不起作用

时间:2014-05-09 09:50:01

标签: c# wpf canvas mvvm caliburn.micro

我有这个xaml:

<Canvas cal:View.Context="DrawCanvas">
    <!--<Line  X1="1" Y1="1" X2="400" Y2="400" Stroke="Black" StrokeThickness="20" IsHitTestVisible="False"/>-->
</Canvas>

在模特中我有:

public Canvas DrawCanvas { get; set; }
public ImageSourceViewModel()
{
    this.PropertyChanged += this.ImageSourceViewModel_PropertyChanged;
    this.Scale = 1;
    this.TranslateX = 0;
    this.TranslateY = 0;
    DrawCanvas=new Canvas();
    var line = new Line();
    line.X1= 1;
    line.Y1 = 1;
    line.X2 = 100;
    line.Y2 = 10;
    line.Stroke=new SolidColorBrush(Colors.Green);
    line.StrokeThickness = 2;
    line.Visibility=Visibility.Visible;
    DrawCanvas.Children.Add(line);
}

我正在使用Caliburn Micro。

它不会在输出上绘制任何行。

这个问题可能有两个原因:

1-视图中的画布未绑定到ViewModel中的DrawCanvas。

2-绘图代码不正确。

如何检查我的视图画布是否实际绑定到ViewModel中的DrawCanvas?绑定的语法是否正确?我正在使用Caliburn Micro。

如果绑定是正确的,那么绘制代码的问题是什么呢?

1 个答案:

答案 0 :(得分:6)

这就是你在MVVM中做到的方式(我从这里修改了解决方案:https://stackoverflow.com/a/1030191/3047078):

在视图中:

<ItemsControl ItemsSource="{Binding Path=Lines}">
  <ItemsControl.ItemsPanel>
    <ItemsPanelTemplate>
      <Canvas Background="White" Width="500" Height="500"  />
    </ItemsPanelTemplate>
  </ItemsControl.ItemsPanel>
  <ItemsControl.ItemTemplate>
    <DataTemplate>
      <Line X1="{Binding X1}" Y1="{Binding Y1}" X2="{Binding X2}" Y2="{Binding Y2}" Stroke="Black" StrokeThickness="3"></Line>
    </DataTemplate>
  </ItemsControl.ItemTemplate>
</ItemsControl>



在ViewModel中,您需要这样的内容:

public ObservableCollection<MyLine> Lines {get;set;}


在模型中:

public class MyLine
{
  public int X1 {get;set;}
  public int Y1 {get;set;}
  public int X2 {get;set;}
  public int Y2 {get;set;}
}