0

WPF: Data Binding mit Properties aus ViewModel

In diesem Artikel beschreibe ich, wie das Data Binding in C# in einem WPF-Projekt funktioniert. Dadurch lässt sich das MVVM-Model (Model, View, ViewModel) realisieren.
Als kleines Beispiel dient hier ein Programm in dem der Status einer CheckBox an ein Property aus dem ViewModel gebunden wird.

Aufbau

In meinem Projekt gibt es einen Ordner Views für die Views und einen Ordner ViewModels in dem sich alle ViewModels befinden. Dort befinden sich jetzt jeweils eine View bzw. ein ViewModel:

– Views
— MyView.xaml (und MyView.xaml.cs)

– ViewModels
— MyViewModel.cs

Viewmodel

Zunächst zum ViewModel. Zuerst braucht man einen PropertyChangedEventHandler, damit signalisiert werden kann, wenn sich was ändert. Das Ganze kann auch bequem in eine Oberklasse ausgelagert werden und alle ViewModels erben dann von dieser Basisklasse.
Natürlich muss man auch noch das Property anlegen.

class MyViewModel : INotifyPropertyChanged
{
    private bool isCheckBoxChecked;

    public bool IsCheckBoxChecked
    {
        get
        {
            return this.isCheckBoxChecked;
        }

        set
        {
            if (this.isCheckBoxChecked != value)
            {
                this.isCheckBoxChecked = value;
                this.NotifyPropertChanged("IsCheckBoxChecked");
            }
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    public void NotifyPropertChanged(string propertyName)
    {
        if (this.PropertyChanged != null)
        {
            this.PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }

    public MyViewModel()
    {
        this.IsCheckBoxChecked = true;
    }
}

Als letzten Schritt setze ich noch probehalber das Property im Konstruktor auf true, so dass beim Testen die CheckBox aktiviert sein müsste.

View

Aber zunächst zu View.
Im XAML wird eine CheckBox erstellt, welche den IsChecked-Wert mit eben erstelltem Property aus dem ViewModel verbindet.

<CheckBox IsChecked="{Binding IsCheckBoxChecked}" />

Damit das ganze funktioniert, müssen wir nun noch die View mit dem ViewModel verbinden. Dazu müssen wir den Kontext setzen:

public partial class MyView : Window
{
    private MyViewModel mainViewModel;

    public MyView()
    {
        InitializeComponent();

        this.mainViewModel = new MyViewModel();
        this.DataContext = mainViewModel;
    }
}

Wir erstellen uns nämlich zunächst eine ViewModel-Instanz und legen den DataContext dann darauf.

Startet man das Programm nun, so wird die CheckBox markiert und der Status ist im ViewModel änderbar und abfragbar.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert