1. Composite User Interface Application Block Peter Provost Development Lead – patterns & practices peter.provost@microsoft.com http://www.peterprovost.org/

2. Application Scenarios Highly intensive, task oriented UIs Client Integration scenarios Call Center  e.g. Microsoft Customer Care Framework Product Configurators Financial or Manufacturing Desktops Tellers The scenarios cover a wide range:  Transactional or data analysis  All new or integration with existing apps  Standalone client or integrate into other applications

3. Billing Inventory CRM Smart Client Module Composite Solution What Is A Composite Smart Client? Compose solution from discrete functional pieces Environment provides basic smart client services & capabilities Reduces dev cost, can realize smart client benefits more easily Flexible and agile – N:M parts:shells, dynamic composition Smart Client Module Module Host Apps

4. WorkItem Module Loading State Composite UI – A patterns view View Controller Model View Presenter Model MVCMVC MVPMVP Blackboar d EnumeratorLoader Core Services Crypto Event Broker State Persistence CAB Application AuthN Extension Shell Services Activation Workspaces UI Extension Sites Commands SPInfo Instrum Lifetime Containe r Service Locator ObjectBuilder FactoryFactory BuilderBuilder Injection types 2..6 Injection types 2..6 Strategy presenters for UI CommandCommand Pub/SubPub/Sub PluginsPlugins Workflow Use Case Controlle r

5. Shell How Does It Work? ModuleCatalog Module UI Extension SiteView View Element Root Work Item Work Item Shared State Shared Events

6. A Work Item Building a composite application How should I organize my code to facilitate composition? Build the views as independent units with controllers or presenters Prepare to share model state Share infrastructure “services” Encapsulate use cases to facilitate reuse Reduce the number and complexity of dependencies  Use events, services, and bind to interfaces as much as possible Smart Part A Controller A Smart Part B Controller B Business Entities Domain Entities Service1

7. A Work Item Developing a “Composite User Experience” How does the CAB architecture facilitate UX composition? SmartParts are controls – Workspaces show them in a specific visual frame  Shell developer builds workspaces. Controls can be agnostic to workspaces UI Elements can be added with common approach to specific sites  Can centralize how/when UI gets affected by a use case Commands  Connecting ‘actionable’ set of UI elements to a business logic callback View A Controller A View B Controller B Business Entities Application Shell UI Extension Site Element1 Element2 UI Init Command Command Windows Workspace Tab Workspace

8. Event Topic topic://Customer/Changed Event Broker – Pub-Sub in your app Publishers and Subscribers agree on:  Topic (identified by a URI)  Message (in case a special EventArgs is required) Publishers set scope of event Publishers Subscribers 1 *.NET Event with Attribute Event Catalog Service.NET method with attribute ThreadOption.Background [EventSubscription(“topic://Customer/Changed”, ThreadOption.Background)] Public void CustomerChanged(object sender, CustArgs args) { //go call some web services or something long-running } ThreadOption.Background [EventSubscription(“topic://Customer/Changed”, ThreadOption.Background)] Public void CustomerChanged(object sender, CustArgs args) { //go call some web services or something long-running } [EventPublication(“topic://Customer/Changed”)] event EventHandler CustomerIdChanged; //fire like a normal.NET event CustomerIdChanged(this, new CustArgs(…) ); [EventPublication(“topic://Customer/Changed”)] event EventHandler CustomerIdChanged; //fire like a normal.NET event CustomerIdChanged(this, new CustArgs(…) ); [EventSubscription(“topic://Customer/Changed”)] Public void CustomerChanged(object sender, CustArgs args){ MessageBox.Show(args.CustomerId,“new customer!”); } [EventSubscription(“topic://Customer/Changed”)] Public void CustomerChanged(object sender, CustArgs args){ MessageBox.Show(args.CustomerId,“new customer!”); } Subscribers have control over the thread in which they process the call  Background (For long-running work)  UI Thread (to update UI controls on appropriate thread)  Publisher (on same thread as publisher)

9. Commands Commands help you react to UI events in a shell agnostic way One Command can map to multiple UI Elements Commands from parent WorkItems can be used but not removed A Work Item Application Shell Control1 Control 2 Adapter Controller A A Command

10. WorkItem Extensions Example:  How do I add new views of my customer data to the right workitems w/out changing their code? WorkItem Extensions allows you to affect WorkItems without changing it  Which one(s)? Identified by type implemented  Can be deployed in a separate module, discovered at load time, or registered programatically [WorkItemExtension(typeof(MyWorkItem))] public class MyExtension: WorkItemExtension { protected override OnActivate() { } [WorkItemExtension(typeof(MyWorkItem))] public class MyExtension: WorkItemExtension { protected override OnActivate() { }

11. Roadmap CAB: Final release targeted for Nov 7 CAB included as foundation for Smart Client Baseline Architecture Toolkit (SC-BAT)  Smart Client Toolkit will also include integration with Entlib, Offline, and project templates Future  UIP: Using WWF, no date yet  Using Avalon + CAB: it is possible Layered design + Winforms interop No public sample before our release

12. Shameless Plug patterns & practices is hiring See me after the talk or e-mail Darrel Snow – dsnow@microsoft.comdsnow@microsoft.com

13. Please Fill Out Your Evals http://eval.pacwest.ms/ Thanks!