MVVM ràng buộc với InkCanvas

Question

Tôi dường như đã chạy vào một khối đường. Chúng tôi đang sử dụng MVVM với Prism và có Chế độ xem yêu cầu Canvas mực. Tôi đã tạo một StrokeCollection đang bị ràng buộc từ ViewModel của tôi đến View. Tôi có thể thiết lập các bộ sưu tập từ viewmodel của tôi nhưng những thay đổi không đến với ViewModel trong khi người dùng vẽ. Có cách nào để làm cho công việc này?

tài sản của tôi trong ViewModel của tôi là như sau:

private StrokeCollection _strokes; 
public StrokeCollection Signature 
{ 
    get 
    { 
     return _strokes; 
    } 
    set 
    { 
     _strokes = value; 
     OnPropertyChanged("Signature"); 
    } 
} 

Đây là XAML dòng ràng buộc của tôi:

<InkCanvas x:Name="MyCanvas" Strokes="{Binding Signature, Mode=TwoWay}" /> 

Đối với một số lý do rõ ràng là InkCanvas không bao giờ thông báo cho ViewModel của bất kỳ sự thay đổi.

Answer 1

Vấn đề với cách tiếp cận của bạn là bạn giả định InkCanvas tạo StrokeCollection. Nó không - nó chỉ đơn thuần là thêm và loại bỏ các mục từ nó. Và nếu bộ sưu tập không có sẵn (ví dụ: null), thì ràng buộc sẽ không thành công và InkCanvas sẽ không làm bất kỳ điều gì với nó. Vì vậy:

1. Bạn cần phải tạo một đơn StrokeCollection
2. Bạn cần phải giả định các nội dung của bộ sưu tập sẽ thay đổi, không phải là bộ sưu tập riêng của mình

Ví dụ mã:

public class ViewModel : INotifyPropertyChanged 
{ 
    private readonly StrokeCollection _strokes; 

    public ViewModel() 
    { 
     _strokes = new StrokeCollection(); 
     (_strokes as INotifyCollectionChanged).CollectionChanged += delegate 
     { 
      //the strokes have changed 
     }; 
    } 

    public event PropertyChangedEventHandler PropertyChanged; 

    public StrokeCollection Signature 
    { 
     get 
     { 
      return _strokes; 
     } 
    } 

    private void OnPropertyChanged(string propertyName) 
    { 
     var handler = PropertyChanged; 

     if (handler != null) 
     { 
      handler(this, new PropertyChangedEventArgs(propertyName)); 
     } 
    } 
} 

Và XAML:

<InkCanvas Strokes="{Binding Signature}"/> 

Answer 2

Lớp StrokeCollection có một sự kiện được gọi là "StrokesChanged" luôn được kích hoạt khi bạn vẽ một cái gì đó trong View. Sự kiện đó chứa tập hợp các nét được cập nhật.

XAML:

<Grid> 
    <InkCanvas Strokes="{Binding Signature}"/> 
</Grid> 

VM:

public class TestViewModel : INotifyPropertyChanged 
{ 
    public StrokeCollection Signature { get; set; } 

    public event PropertyChangedEventHandler PropertyChanged; 

    public TestViewModel() 
    { 
     Signature = new StrokeCollection(); 
     Signature.StrokesChanged += Signature_StrokesChanged; 
    } 

    void Signature_StrokesChanged(object sender, StrokeCollectionChangedEventArgs e) 
    { 
     //PUT A BREAKPOINT HERE AND CHECK 
     Signature = (System.Windows.Ink.StrokeCollection)sender; 
    } 

} 

Hy vọng nó sẽ giúp!