http:/facebook/honeydev 1

Introduction to MVVM In Silverlight

Honeyson Joseph D

http:/facebook.com/honeydev

http:/facebook/honeydev 2

What is MVVM ??

MVVM is nothing but a Pattern.

Also known as Presentational Model.

Model-View-ViewModel pattern is similar to MVC

http:/facebook/honeydev 3

Let’s see some variations of similar patterns

MVC Pattern

Model View Controller is probably the oldest pattern.

Still using widely, especially with ASP.NET MVC.

http:/facebook/honeydev 4

Passive View Pattern

View is completely Passive.

The controller has lot of responsibilities.

Testing a View is very difficult and time consuming.

http:/facebook/honeydev 5

Presentation Model Pattern(MVVM)

Controller is replaced with ViewModel.

View is more active and pushing information to the Model.

The interactions is done via Data Binding.

http:/facebook/honeydev 6

http:/facebook/honeydev 7

Model represents the business domain which includes the

model classes used (Customer, Order, etc.), data access

code and business rules.

Model

http:/facebook/honeydev 8

View in MVVM represents the screens that we build.

Includes : 1.XAML files 2.code-beside files Responsibilities :

1.displaying data 2.collecting data from end users

View isn't responsible for retrieving data, performing any

business rules or validating data

View

http:/facebook/honeydev 9

ViewModel acts as middle-man between View and Model

Responsibilities :

Aggregating and storing data that will be bound to a View

ViewModel

http:/facebook/honeydev 10

Helpers around MVVM…

CommandsMessages

http:/facebook/honeydev 11

View might need to notify the ViewModel about something happened in the View.

eg: a control being clicked.

ViewModel need to notify to the View when something happen.

For these we use Events, another good way is to use Messages.

Helpers around MVVM…cont

http:/facebook/honeydev 12

MVVM in Silverlight

We use MVVM Light Tools V.x

This is an open source MVVM very light Framework with 2 DLLs

Components

RelayCommand

Messenger

ViewModelBase.

Also1. EventToCommand which can be used to get rid of annoying

WPF and SL Command binding limitations.

2. DispatcherHelper for multi-threaded applications.

http:/facebook/honeydev 13

For Example

Step 1

VIEW Model

VIEW

PersonViewModel contructor connects to PersonModel

Button Base.Command connects view with ViewModel (GetPerson returntype is Icommand—comand object)- following Commn design pattern

http:/facebook/honeydev 14

Model

Property changed event results in UI updates – from context (two way binding)

http:/facebook/honeydev 15

Go on more, share your knowledge that help to others including me……………THANK YOU !

References:

http://weblogs.asp.net/dwahlin/archive/2009/12/08/getting-started-with-the-mvvm-pattern-in-silverlight-applications.aspx

http://www.silverlight.net/learn/tutorials/silverlight-4/using-the-mvvm-pattern-in-silverlight-applications/

http://www.astaticstate.com/2010/04/silverlight-4-using-mvvm-patter-ria.html