As the software world continues to adopt WPF at an increasing rate, the WPF
community has been developing its own ecosystem of patterns and practices. In
this article, I'll review some of those best practices for designing and
implementing client applications with WPF. By leveraging some core features of
WPF in conjunction with the Model-View-ViewModel (MVVM) design pattern.
Why MVVM?
Once a developer becomes comfortable with WPF and MVVM, it can be difficult
to differentiate the two. MVVM is well suited to the WPF platform, and WPF was
designed to make it easy
to build applications using the MVVM pattern.
The most important aspect of WPF that makes MVVM a great pattern to use is - the
data binding infrastructure, which allows the View (the presentation of to the
user) to be separated from the data and the logic. The View can be designed in
Expression Blend while the ViewModel can be developed in Visual Studio .NET. And
the other features of WPF are data templates and the resource system.
MVVM Architecture:
Difference between MVP, MVC and MVVM:
Mostly it is very confusing to know the difference between MVP
(Model-View-Presenter), MVC (Model-View-Controller) and MVVM
(Model-View-View-Model). Here I am trying to clear all the 3 with the help of
diagram:
MVP (Model-View-Presenter)
In the MVP pattern the User sends the input to the view, the view forward it to
presenter and presenter than modify the view or the model depending on the type
of user action. The view and the presenter are tightly coupled through
bi-directional relationship. The model does not know about the presenter. The
view itself is passive, thats why it's called presenter pattern, since the
presenter pushes the data into the view.
Diagram:
MVC (Model-View-Controller:
In this pattern there is only one controller that gets all the inputs directly,
it modifies the data in the model depending upon the type of the input. Both the
model and the view are created by the controller. The view only knows about the
model, but the model does not know about any other objects.
Diagram:
MVVM (Model-View-ViewModel):
The Model View ViewModel (MVVM) is an architectural pattern used in software
engineering that originated from Microsoft which is specialized in the
Presentation Model design pattern. It is based on the Model-view-controller
pattern (MVC), and is targeted at modern UI development platforms (WPF and
Silverlight) in which there is a UX developer who has different requirements
than a more "traditional" developer. MVVM is a way of creating client
applications that leverages core features of the WPF platform, allows for simple
unit testing of application functionality, and helps developers and designers
work together with less technical difficulties.
VIEW: A View is defined in XAML and should not have any logic in the
code-behind. It binds to the view-model by only using data binding. The View
contains the visual controls that will be shown to the user and can also contain
animations, navigation aspects, themes, and other interactive features for the
purpose of the visual presentation. The View is data bound directly to the
Model. Parts of the Model are simply displayed in the view by one-way data
binding. Other parts of the model can be edited by directly binding controls
two-way to the data. It acts as a bridge between your software and its users.
MODEL: Model is responsible for exposing data in a way that is easily
consumable by WPF. It must implement INotifyPropertyChanged and/or
INotifyCollectionChanged as appropriate. When data is expensive to fetch, it
abstracts away the expensive operations, never blocking the UI thread. It is the
data or business logic, completely UI independent, that stores the state and
does the processing of the problem domain. The Model is written in code or is
represented by pure data encoded in relational tables or XML.
VIEWMODEL: A ViewModel is a model for a view in the application or we can
say as abstraction of the view. It exposes data relevant to the view and exposes
the behaviors for the views, usually with Commands. The ViewModel is the glue
between the View and the outside world. The ViewModel is what the View is bound
to. It provides a specialization of the Model that the View can use for
data-binding.
Here is a simple illustration how all the 3 relate to each other:
MVVM in WPF:
MVVM in WPF relies heavily on WPF's excellent binding capabilities to remove
some of this plumbing code, leaving us to focus on the logical model of our view
or the ViewModel, and our application. The goal of MVVM is to separate the
design of the application from the data and the functionality, while supporting
multiple development languages (e.g. C#/XAML) and taking full advantage of rich
databinding.
Here is the Running window of our Application Using MVVM in WPF:
