1. Introduction to the MVVM Pattern
MVVM and Silverlight
Reddy Kadasani
Project Manager
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018

2. Stands for Model-View-ViewModel It is a Software Design Pattern
What is MVVM?
Stands for Model-View-ViewModel
It is a Software Design Pattern
Silverlight and WPF are Built on MVVM
Guis consist of widgets that contain the state of the UI screen. Leaving the state of the UI in the widgets makes it harder to get to this state and manipulate it. .
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018

3. Model –View-Controller
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018

4. Presentation Model Pattern (MVVM)
State and Behavior of the “Presentation”
Moving the State outside the Widgets or Controls
a.k.a Application Model
Model
View
Presentation
(ViewModel)
The Presentation Model pulls the state and behavior of the view out into the model class that is part of the presentation. The PM coordinates with the domain layer and provides an interface to the view. This minimizes the decisions that the view needs to make. The view either stores all of its state in the Presentation Model or synchronizes its state with the Presentation Model frequently.
The PM may interact with several domain objects, but the PM is not a GUI friendly façade to a specific domain object. The PM is actually an abstract of the view that is not dependent on a specific GUI framework.
Data Binding
State and Behavior
Commands
Events
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018

5. Presentation Model Pattern (MVVM)
A View should require only one Presentation Model
Several Views can utilize the same Presentation Model
View
View
Presentation
(ViewModel)
State and Behavior
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018

6. Synchronization Between the Presentation Model and View
Key Points to Consider
Synchronization Between the Presentation Model and View
Repetitive Code
Where to put the Synch Code?
Should the View Reference the PM?
Should the PM Reference the View?
Testability
Maintainability
Frameworks
PRISM
MVVM Light Toolkit
A Presentation Model that references a view generally maintains the syncronization code in the Presentation Model. The resulting view is very dumb. The view contains setters for any state that is dynamic and raises events in response to user actions. The views implement interfaces allowing for easy stubbing when testing the Presentation Model. The Presentation Model will observe the view and respond to events by changing any appropriate state and reloading the entire view. As a result the syncronization code can be easily tested without needing the actual UI class.
A Presentation Model that is referenced by a view generally maintains the syncronication code in the view. Because the syncronization code is generally easy to write and easy to spot errors it is recommended that the testing occur on the Presentation Model and not the View. If you are compelled to write tests for the view this should be a clue that the view contains code that should belong in the Presentation Model. If you prefer to test the syncronization, a Presentation Model that references a view implementation is recommended.
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018

7. How does it work in Silverlight?
Dependency Properties
INotifyPropertyChanged
UI Element
(Dependency Property)
(CLR Object)
(Property)
Binding Object
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018

8. How does it work in Silverlight?
Data Template
Data Binding
Notifying of Change
Relay Command
Messages (Events)
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018

9. DEMO
DEMO
Create a Simple Silverlight Application that uses MVVM to display a list of Movies
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018

10. References
Presentation Model – Martin Fowler ( el.html)
Passive View – Martin Fowler ( ml)
Silverlight and MVVM
Silverlight.net
WPF Apps with MVVM ( us/magazine/dd aspx)
MVVM Toolkit (
Tallan, Inc. Proprietary and Confidential. Copyright 2010.
11/15/2018