1 / 26

M-V-VM All-Day

M-V-VM All-Day . Jaime Rodriguez http://blogs.msdn.com/jaimer. January 2009. Agenda. MVVM Intro ( 0:30 ) Trees ( 0: 20 ) Commands (0:30) Break (0:15) Views ( 0:35 ) Validation ( 0:45 ) UI Data binding Exceptions (0:20) Lunch (1:00) Logging ( 0:20 ) Testing (0:20)

wallis
Download Presentation

M-V-VM All-Day

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. M-V-VM All-Day Jaime Rodriguez http://blogs.msdn.com/jaimer January 2009

  2. Agenda • MVVM Intro ( 0:30 ) • Trees ( 0: 20 ) • Commands (0:30) • Break (0:15) • Views ( 0:35 ) • Validation ( 0:45 ) • UI Data binding Exceptions (0:20) • Lunch (1:00) • Logging ( 0:20 ) • Testing (0:20) • Tips & Tricks ( 1:00 ) • Lab & Q&A.

  3. Introduction to Model-View-ViewModel

  4. An architecture mindset…

  5. Model,View, View/Model View Resource Dictionaries Styles Controls Data Triggers Control Templates Triggers Data templates Commands Events Binding ViewModel Test Events Model *Proportions not exact, but do illustrate a point

  6. Benefits of M-V-VM • Separation of Concerns • Loose coupling • Testability • Maintainability • Reuse • Designer & developer friendly • Richer User Interface • Higher fidelity in design • Skinning • Productivity

  7. Southridge demo

  8. Trees

  9. Logical, Visual & Inheritance tree • Logical Tree • What you put in the XAML • Visual Tree • The visuals to be rendered • Inheritance tree • Hybrid of two above + freezables.

  10. <DockPanel …. <Button Content='Content' DockPanel.Dock='Top' /> <ListBox> <ListBoxItem>test</ListBoxItem> test2 <Button Content='inside listbox' /> </ListBox> </DockPanel> Trees demo

  11. Why should you care? • DataContext is inherited via the Inheritance tree • Resources prefer’ the logical tree • Routed Events & RoutedCommands prefer through the visual tree • Except Menus, they are focus scope so they go back to focused element in window.

  12. Views

  13. Where to start…

  14. DataTemplates as Views • ViewModel is instantiated • Views are DataTemplates

  15. UserControl as View • View is instantiated • ViewModel is instantiated by view or it is passed into view via DataContext

  16. Navigation

  17. Life-cycle • Initialization • Setting DataContext before view is initialized is better for Command’s CanExecute and for performance. • Shut-down/Closing • Clean up command bindings and events • Be careful with DelegateCommand and CanExecuteChanged, it needs to be a weak reference.

  18. CanExecuteChanged wiring • For commands w/ out CanExecute • For commands with CanExecute • Weak Event pattern on MSDN public event EventHandlerCanExecutChanged { { add {}; remove{}; } public event EventHandlerCanExecutChanged { { add {CommandManager.RequerySuggested += value;}; remove{CommandManager.RequerySuggested -= value;}; }

  19. Tips & Tricks

  20. Think Data First • Attached Behaviors for events • Blend Design time • Forward DataContext through “inheritance tree” • Sharing ViewModels • Not all data is a ViewModel • Caution!! Datatriggers • Data integrity on ViewModel wrappers • Avoid CommandManager whenever possible.

  21. Thank You!!

  22. Presentation Model = MVVM • Presentation Model: • Self contained class representing all data & behavior but no rendering. • Contains the Dynamic state of the view • Tight synchronization with the view • View projects state of the presentation model

More Related