WPF with MVVM: From the Trenches

Brent Edwards Senior Consultant with Magenic BrentE@magenic.com @brentledwards brentedwards.net

What We Will Cover ,[object Object]

Helpful tricks to make life easier

Useful tools that make debugging suck less

Develop sample app as we go,[object Object]

What is MVVM? Model Business logic Business Object View Presentation XAML View Model Functionality Model for the View

Why is MVVM Cool? Separates Presentation from Functionality Promotes testability Works great with Data Binding Easy collaboration with Designers No code-behinds

Cost of MVVM No built in IDE support All interactions must be manually wired up New and shiny, but fragmented Lots of different frameworks Lots of different opinions

DataContext What is it? A way to give elements a scope for data binding Why is it cool? Makes it easy to bind controls Can be static or dynamic

DataContext How is it used? Statically OR

DataContext How is it used? Dynamically From code

Data Binding What is it? A way for applications to present and interact with data Why is it cool? Simple syntax to set up, WPF does the rest

Data Binding How is it used? Binding syntax in XAML Two Way (Default Behavior) Implement INotifyPropertyChanged on view model or business object

Commanding What is it? A way to bind commands to a DataContext Why is it cool? Can wire UI events to fire commands on View Model Can pass parameters via binding

Commanding How is it used? Expose ICommand property on View Model Assign a command to the property Prism’s DelegateCommand Bind to command in XAML

Data Templates What is it? A way to define the presentation of your data Why is it cool? Can give a ‘look’ to your business objects You can leverage data binding

Data Templates How is it used?

Data Triggers What is it? Set style properties based on data values Why is it cool? Change presentation based on data properties

Value Converters What is it? Converts data value to format required by UI Why is it cool? Easy way to convert DateTime, Decimals, Integers or Booleans

Value Converters How is it used? Implement IValueConverter Convert, ConvertBack Include in Resources with a Key Use it!

Data Template Selectors What is it? Select DataTemplate based on custom logic Why is it cool Select DataTemplate based on properties on view models or business objects Can be unit tested

Data Template Selectors How is it used? Inherit from DataTemplateSelector Add properties for the DataTemplates to select from Override SelectTemplate Add logic to actually select the template Add DataTemplates to XAML

Data Template Selectors How is it used? Add DataTemplateSelector to XAML Use it! ContentControl ListView ListBox

Data Template Selectors [Demo]

Helpful Tricks [To make life easier]

Event Aggregator / Message Bus What is it? Centralized location to route [Events | Messages] Why is it cool? Great way to decouple view models Makes testing a breeze

Event Aggregator / Message Bus How is it used? Use an IOC container Castle Windsor Implement as a Singleton Static property Important that all calls route through same instance Options Prism’s Event Aggregator Roll your own

Event Aggregator / Message Bus [Demo]

Navigation The Problem Views coupled with other Views View Models know about Views No separation of concerns No testability

Navigation A Solution Some Convention, Some Configuration Leverage [Event Aggregator | Message Bus] Leverage IOC Castle Windsor Leverage Reflection

Navigation Convention View Models all have default constructors View Models have an optional Load method with 0 or 1 argument(s)

Navigation Configuration – Key Players ViewTargets ViewConfiguration ViewController ViewResult ViewFactory ContainerConfiguration

Navigation Configuration - ViewTargets Enumerates the views which can be navigated to The glue that sticks everything together

Navigation Configuration - ViewConfiguration Pairs a View with an optional View Model Associated to a ViewTarget in the IOC Container

Navigation Configuration - ViewController The only object that interacts with the UI framework Listens for [Events | Messages] related to showing views Gives view details to ViewFactory to be built

Navigation Configuration – ViewFactory Resolves ViewConfiguration for the requested View Dynamically creates the View and View Model Loads the View Model with optional params using reflection Gives back a ViewResult

Navigation Configuration – ViewResult Result of the dynamic build process Has the built View along with any relevant data Used by ViewController to show the View

Modal Dialogs Problem Modal dialogs stall tests [MessageBox| OpenFileDialog| PrintDialog] How can you leverage these and keep view models testable?

Modal Dialogs Option 1 Wrap them up! Define interface IMessageShower Define implementation MessageShower Wire up with IOC Container Castle Windsor Test with mocks RhinoMocks

Modal Dialogs Option 2 [Event Aggregator | Message Bus] Create [Events | Messages] Create class listen for [Events | Messages] that get published Test by verifying [Events | Messages] are published Good for “Fire and Forget” Breaks down if results are returned

Magic with ContentControl The Problem Editable View and Read Only View Views have identical layout TextBox in for Editable Label for Read Only

Magic with ContentControl A Solution – ContentControl! DataTriggers Give different presentation depending on data values Works dynamically DataTemplateSelector Select which DataTemplate to use Only works when initially bound

Magic with ContentControl [Demo]

Useful Tools [To make debugging suck less]

Snoop Inspects visual tree Shows properties Shows events Can show 3D representation

WPF with MVVM: From the Trenches

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (20)

Andere mochten auch

Andere mochten auch (20)

Ähnlich wie WPF with MVVM: From the Trenches

Ähnlich wie WPF with MVVM: From the Trenches (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

WPF with MVVM: From the Trenches

Hinweis der Redaktion