Bryan Albrecht

MVVM Pattern

Nutzen

Das MVVM Pattern ist dafür da, die Darstellung, die Logik und die Benutzerschnittstelle zu trennen. Eingesetzt wird dieses Pattern vor allem bei modernen Programmiersprachen wie z.B. Windows Presentation Foundation(WPF).

Durch diese Trennung ist es gut möglich die einzelnen Ebenen von verschiedenen Entwicklungsteams erarbeiten zu lassen.

Model

Das Model ist dazu zuständig die Daten, welche für die Anzeige zu manipulieren.

Das Model stellt folgende Funktionen zur Verfügung:

-Validierung

-Benachrichtigung bei Eigenschafts-änderungen.

-Verarbeitung von Business-Rules

Beispiel für ein Model:

  1. public class ModelBase : INotifyPropertyChanged, IDataErrorInfo
  2. {
  3. protected void RaisePropertyChanged(string propertyName)
  4. {
  5. PropertyChangedEventHandler handler = PropertyChanged;
  6. if (handler != null)
  7. handler(this, new PropertyChangedEventArgs(propertyName));
  8. }
  9. public event PropertyChangedEventHandler PropertyChanged;
  10. public virtual string Error
  11. {
  12. get { return String.Empty; }
  13. }
  14. }

View

Die View ist dafür zuständig das anzuzeigen, was der Benutzer sieht.

Hierbei werden Bilder, Videos usw. angezeigt.

Interaktionen mit dem Benutzer werden hierbei abgefangen und an das ViewModel weitergeleitet.

Im Code-Behind ist es auch möglich Code zu schreiben. Dieser sollte sich aber auf die View beziehen.

Durch die Datenbindungen ist es möglich die View einfach durch eine andere auszutauschen.

Beispiel für View:

  1. <UserControl x:Class="DevTyr.MvvmObjectsDemo.View.CompanyView"
  2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  4. xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  5. xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  6. mc:Ignorable="d"
  7. d:DesignHeight="300" d:DesignWidth="300">
  8. <Grid>
  9. <Grid.ColumnDefinitions>
  10. <ColumnDefinition Width="Auto"/>
  11. <ColumnDefinition Width="*"/>
  12. </Grid.ColumnDefinitions>
  13. <Grid.RowDefinitions>
  14. <RowDefinition Height="Auto"/>
  15. </Grid.RowDefinitions>
  16. <TextBlock Text="Name" Grid.Row="0"/>
  17. <TextBox Text="{Binding Name}" Grid.Column="1" Grid.Row="0"/>
  18. </Grid>
  19. </UserControl>

ViewModel

Das ViewModel stellt wie der Namen schon sag das Model für die View dar. Auf das ViewModel kann eine Bindung erstellt werden, welche eine Variabel setzt. Es ist auch möglich Funktionen zu schreiben, diese werden ebenfalls gebunden.

Da das ViewModel nicht das gleiche wie der Code-behind ist, darf man hier keine Referenzen auf Elemente in der View erstellen.

Beispiel für ViewModel:

  1. public class ViewModelBase : INotifyPropertyChanged
  2. {
  3. protected void RaisePropertyChanged(string propertyName)
  4. {
  5. PropertyChangedEventHandler handler = PropertyChanged;
  6. if (handler != null)
  7. handler(this, new PropertyChangedEventArgs(propertyName));
  8. }
  9. #region INotifyPropertyChanged Members
  10. public event PropertyChangedEventHandler PropertyChanged;
  11. #endregion
  12. }

Beispiel für Implementierung:

  1. public class CompanyViewModel : ViewModelBase
  2. {
  3. private CompanyModel model;
  4. public CompanyModel Company
  5. {
  6. get { return model; }
  7. set
  8. {
  9. if (model == value)
  10. return;
  11. model = value;
  12. RaisePropertyChanged("Company");
  13. }
  14. }
  15. }