MVVM - Model View ViewModel

Uploaded on

An introduction to MVVM design pattern

An introduction to MVVM design pattern

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
  • Hi,

    Here is the link of implementation of MVVM pattern in WPF with Example

    Are you sure you want to
    Your message goes here
No Downloads


Total Views
On Slideshare
From Embeds
Number of Embeds



Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

    No notes for slide


  • 1. Intro to MVVM Dareen Alhiyari Senior Consultant
  • 2. What is MVVM• MVVM is a design pattern• MVVM stands for Model-View-ViewModel
  • 3. Design Patterns• Design patterns are a set of guidelines• Design patterns are Not a set of rules
  • 4. ModelIt is your data or classes that represententities in your application. It normallycontains no WPF-specific code. • Entity • Service Proxy • POCO (Plain Old CLR Object)
  • 5. ViewThis is the User Interface element visible tothe user. Its DataContext is its ViewModel. • XAML (WPF) • XAML with Code Behind (Silverlight)
  • 6. ViewModelIt contains all the data that needs to bedisplayed and procedures to modify the modelat will. The magic about MVVM is that theViewModel knows nothing about the View. • State • Operations • Not dependent on the view
  • 7. MVVM Relations ViewModelCommands Binding View Model
  • 8. Loosely Coupled• The View knows the ViewModel but the ViewModel does not know the View.• You can very easily replace the View without affecting the ViewModel.• This is very useful in Developer/Designer teams where the Developer improves the ViewModel and the Designer enhances the View.
  • 9. User InteractionWe always have had commands in WPF. MVVMleverages on this feature. Instead of writing eventhandling code for button clicks, we bind the buttons(or MenuItems) in the View to Commands in theViewModel.
  • 10. Commands
  • 11. Commands
  • 12. MVVM vs. MVC (Model-View-Controller)MVVM MVC View View * * 1 1ViewModel Controller Model Model
  • 13. Benefits of MVVM• Loose coupling• Testable code• Maintainable code
  • 14. Some MVVM FrameworksCheck out this handy tool to compare MVVM frameworks: MVVM Comparison Tool - Silverlight• PRISM (Microsoft) • Core MVVM• MVVM Light (Laurent Bugnion) • Onyx• WPF Application Framework • nRoute• Chinch • MVVM Foundation• Caliburn Micro • How to build your own MVVM Framework
  • 15. Thank you! Dareen Alhiyari Senior Consultant