Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

MVVM - Model View ViewModel


Published on

An introduction to MVVM design pattern

Published in: Technology
  • Hi,

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

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

MVVM - Model View ViewModel

  1. 1. Intro to MVVM Dareen Alhiyari Senior Consultant
  2. 2. What is MVVM• MVVM is a design pattern• MVVM stands for Model-View-ViewModel
  3. 3. Design Patterns• Design patterns are a set of guidelines• Design patterns are Not a set of rules
  4. 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. 5. ViewThis is the User Interface element visible tothe user. Its DataContext is its ViewModel. • XAML (WPF) • XAML with Code Behind (Silverlight)
  6. 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. 7. MVVM Relations ViewModelCommands Binding View Model
  8. 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. 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. 10. Commands
  11. 11. Commands
  12. 12. MVVM vs. MVC (Model-View-Controller)MVVM MVC View View * * 1 1ViewModel Controller Model Model
  13. 13. Benefits of MVVM• Loose coupling• Testable code• Maintainable code
  14. 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. 15. Thank you! Dareen Alhiyari Senior Consultant