View stunning SlideShares in full-screen with the new iOS app!Introducing SlideShare for AndroidExplore all your favorite topics in the SlideShare appGet the SlideShare app to Save for Later — even offline
View stunning SlideShares in full-screen with the new Android app!View stunning SlideShares in full-screen with the new iOS app!
Intro to MVVM Dareen Alhiyari Senior Consultant Dareen@Softact.com Dareen.Alhiyari@gmail.com
What is MVVM• MVVM is a design pattern• MVVM stands for Model-View-ViewModel
Design Patterns• Design patterns are a set of guidelines• Design patterns are Not a set of rules
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)
ViewThis is the User Interface element visible tothe user. Its DataContext is its ViewModel. • XAML (WPF) • XAML with Code Behind (Silverlight)
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
MVVM Relations ViewModelCommands Binding View Model
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.
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.