Architecting WPF Applications

Paul StovellSenior Consultant

WPF Technical SpecialistReadify

Agenda WPF Overview Inductive vs. Deductive UI Navigation Presentation Patterns Composition Inter-view Communication Dependency Injection Partitioning Leveraging XAML Performance Considerations

WPF Overview

Unified Presentation

GDI/Windows

Forms

COM Interop

Flash DirectX PDF WPF

Interactive UI

controls

Documents 3D

Animation

Video

Web or Windows?

Windows Intranet Internet

Silverlight

Windows Forms

JavaJava

Applets

WPF XBAP

WPF

ASP.NET

AJAX

XBAP

XBAP

WPF Releases

.NET Framework 3.0 .NET Framework 3.5 .NET Framework 3.5 Service Pack 1 .NET Framework 4.0

Inductive vs. Deductive

Deductive UI

Deductive UI

Inductive UI

Inductive UI

Inductive vs. Deductive

Why does it matter? UI composition Patterns Navigation Patterns Service Layer

ChangeAddress vs. SaveCustomer

DataGrid

Navigation

Linked List

Page 1 Page 2 Page 3 Page 4

Centralized Decisions

Page 1

Page 2

Page 3

Page 4

Navigation Handler

Presentation Patterns

Presentation Patterns

Model-View-ViewModel aka Presentation Model

Model-View-Presenter aka Supervising Controller

Model-View-Controller

Model View ViewModel

Change Address View

AccountsChange Address

ViewModel

Customer

Address

Model

Model View ViewModel (Wrapped)

Change Address View

Account VM

Change Address ViewModel

Customer VM

Address VM

View Model

Account

Customer

Address

Model

Model View Presenter

Change Address View

AccountsChange Address

Presenter

Customer

Address

Model

IChangeAddressView

Model View Presenter with VM

Change Address View

AccountsChange Address Presenter

Customer

Address

Model

IChangeAddressView

Change Address

ViewModel

State

Behaviour

Model View ControllerView 1

Controller

Model 1

View 2

Model 2

View 3

Model 3

Nav Request

Presentation Patterns

Things to consider: Does every view need separated

presentation? Does every view need to follow the

same pattern? Code Behind isn’t Evil (DataGrids are) MVPoo

UI Composition

Model-based Composition

Recent Orders ViewModel

Search ViewModel

Weather ViewModel

Order ListSearch

Weather

UI-based Composition

Order ListTop Region

Bottom Region

Bottom-Up

Search Weather

Navigation

1. Resolve

2. Place

UI-based Composition

Order ListTop Region

Bottom Region

Top-Down

Search Weather

Inter-View Communication

Inter-View CommunicationStandard .NET events

Search Model

Results Model

Criteria Model

1. Child model raises event

2. Parent model forwards event

Inter-View CommunicationEvent Aggregator

Results Model

Criteria Model hubPublish

Handle

Advert Model

Handle

Recent Searches

Model

Publish

Event Aggregator

Advantages: Automatic thread switching Weak events Hook for cross-cutting concerns

Dependency Injection

Dependency Injection

Partitioning

Partitioning

Splitting partitions: By SKU By feature By team By department

Partitioning

Managing partitions: With solutions With projects With assemblies

Partitioning

Resolving: Hard-coded Config Discovery

Partitioning

Also consider: Deployment and patching Inter-partition dependencies Dev time vs. build time partitioning

Partitioning

Remember: assemblies are like water

necessary for life……but too much can kill you!

Leveraging XAML

Abstractions<Grid> <..> <Label Grid.Row="0" Grid.Column="0" Content="First Name:" Target="{Binding ElementName=FirstNameTextBox}" /> <TextBox Grid.Row="0" Grid.Column="1" Name="FirstNameTextBox" Text="{Binding Path=FirstName}" /></Grid>

<Form> <Field For="{Binding Path=FirstName}" /> <Field For="{Binding Path=LastName}" /> <Field For="{Binding Path=EmailAddress}" /></Form>

Consistency<TextBlock Foreground="Red" Text="Please enter..." />

<TextBlock Foreground="{StaticResource Color.Bad}" Text="Please enter..." />

Style Catalogues<TextBox Width="300" .../><TextBox Width="156" .../><TextBox Width="215" .../>

<TextBox Style="{StaticResource TextBox.Big}" /><TextBox Style="{StaticResource TextBox.Small}" /><TextBox Style="{StaticResource TextBox.Medium}" />

Behaviours

Consider this:

Developers don't write code; they build

tools for designers

Performance Considerations

Performance Considerations

1. Retained scene vs. Immediate Mode2. Virtualization (data and UI)3. Memory leaks4. Third party components5. Performance test from day 1

Q&A

Links: http://www.codeplex.com/CompositeWPF http://magellan.codeplex.com http://www.galasoft.ch/mvvm/getstarted/ http://caliburn.codeplex.com

Paul Stovellpaul@paulstovell.comwww.paulstovell.com