1. Windows Presentation Foundation: The Next GDI? Shawn Wildermuth MVP, MCSD.NET, MCT, Author and Speaker Shawn Wildermuth MVP, MCSD.NET, MCT, Author and Speaker

2. Windows Presentation Framework: The Next GDI? Who I Am Shawn Wildermuth – swildermuth@adoguy.com – http://adoguy.com Independent Consultant and Trainer INETA Speaker Book Author – “Pragmatic ADO.NET” – MCTS Self-Paced Training Kit (Exam 536) – MCPD Self-Paced Training Kits (Exams 547, 548 & 549) – “Prescriptive Data Architectures” - Upcoming This Presentation can be found at: – http://adoguy.com/presentations Shawn Wildermuth – swildermuth@adoguy.com – http://adoguy.com Independent Consultant and Trainer INETA Speaker Book Author – “Pragmatic ADO.NET” – MCTS Self-Paced Training Kit (Exam 536) – MCPD Self-Paced Training Kits (Exams 547, 548 & 549) – “Prescriptive Data Architectures” - Upcoming This Presentation can be found at: – http://adoguy.com/presentations

3. Windows Presentation Framework: The Next GDI? Agenda Happy Birthday GDI Introducing WPF Hardware Rendering XML Based Markup Layout New Control Model Happy Birthday GDI Introducing WPF Hardware Rendering XML Based Markup Layout New Control Model

4. Windows Presentation Framework: The Next GDI? Happy Birthday GDI Been around for 20 years – Amazing longevity – Allows writing of productive apps easily – Developer high productivity Been around for 20 years – Amazing longevity – Allows writing of productive apps easily – Developer high productivity

5. Windows Presentation Framework: The Next GDI? Happy Birthday GDI (2) Problems with GDI – Easy to write vanilla looking applications – Hard to write good looking applications – Dated Look and Feel – Owner-Drawn code is hard – 2-D is better with GDI+, but still verbose – 3-D is possible with DirectX but difficult Problems with GDI – Easy to write vanilla looking applications – Hard to write good looking applications – Dated Look and Feel – Owner-Drawn code is hard – 2-D is better with GDI+, but still verbose – 3-D is possible with DirectX but difficult

6. Windows Presentation Framework: The Next GDI? Happy Birthday GDI (3) Product Differentiation – Bigger challenges grabbing user interest – Grey boxes are on their way out – OS X adding to the competitive pressure Product Differentiation – Bigger challenges grabbing user interest – Grey boxes are on their way out – OS X adding to the competitive pressure

7. Windows Presentation Framework: The Next GDI? Error loading page

8. Windows Presentation Framework: The Next GDI?

9. Introducing WPF Originally Part of Vista only – Now works with XP SP2 and W2K3 SP1 Now Available – Runtime lets you run WPF Apps – SDK includes VS 2005 Support The GDI for the next 10 Years Originally Part of Vista only – Now works with XP SP2 and W2K3 SP1 Now Available – Runtime lets you run WPF Apps – SDK includes VS 2005 Support The GDI for the next 10 Years

10. Windows Presentation Framework: The Next GDI? What is WPF Hardware Rendered Graphics System – Not tied to DPI Improved Control Model – Easier to create custom UI’s XML Based Markup Language (XAML) – Similar ASP.NET 2.0 Programming Model Program Deployment Models – Standalone, Click Once and Express Apps Hardware Rendered Graphics System – Not tied to DPI Improved Control Model – Easier to create custom UI’s XML Based Markup Language (XAML) – Similar ASP.NET 2.0 Programming Model Program Deployment Models – Standalone, Click Once and Express Apps

11. Windows Presentation Framework: The Next GDI? Hardware Rendered Graphics Drawing Directly with GPU – Everything is Accelerated Impact on Battery – Reduced CPU Load Should Balance GPU Load Scalable Renderers – Three levels of rendering  Level 0: Software  Level 1: DirectX 7+ Support –(Pixel and Vertex Shaders), 32 Megs Video Memory  Level 2: DirectX 9+ Support –(Pixel Shader 2.0), 64 Megs of Video Memory Drawing Directly with GPU – Everything is Accelerated Impact on Battery – Reduced CPU Load Should Balance GPU Load Scalable Renderers – Three levels of rendering  Level 0: Software  Level 1: DirectX 7+ Support –(Pixel and Vertex Shaders), 32 Megs Video Memory  Level 2: DirectX 9+ Support –(Pixel Shader 2.0), 64 Megs of Video Memory

12. Windows Presentation Framework: The Next GDI? Improved Control Model GDI Challenges – Controls are not flexible – Setting Properties are the path to customization – Owner-drawing controls are expensive – Advanced customization requires significantly more work. GDI Challenges – Controls are not flexible – Setting Properties are the path to customization – Owner-drawing controls are expensive – Advanced customization requires significantly more work.

13. Windows Presentation Framework: The Next GDI? Improved Control Model (2) New Control Model – Build with the platform for the platform – Controls can contain anything (e.g. Controls) – Controls have flexible styling model

14. Windows Presentation Framework: The Next GDI? Improved Control Model (3) Keyboard Navigation – Use arrow keys to navigate your application – Separate from Tab Navigation Globalization and localization – “Size to content” by default – Built-in support for “right to left” Accessibility – Accessibility is not an afterthought – UIAutomation patterns in all base classes— consistent across all controls Keyboard Navigation – Use arrow keys to navigate your application – Separate from Tab Navigation Globalization and localization – “Size to content” by default – Built-in support for “right to left” Accessibility – Accessibility is not an afterthought – UIAutomation patterns in all base classes— consistent across all controls

15. Windows Presentation Framework: The Next GDI? Improved Control Model (4) Look-less Controls – Do not contain “Render” code Visual Behavior – Visuals Come From  Your App  Theme File – Keep Behavior, Change Style  Separation between UI Design and UI Functionality Look-less Controls – Do not contain “Render” code Visual Behavior – Visuals Come From  Your App  Theme File – Keep Behavior, Change Style  Separation between UI Design and UI Functionality

16. Windows Presentation Framework: The Next GDI? Programming Model XAML – “XML Application Markup Language” – The Design Language of WPF – Tools will create XAML or Can be Hand coded BAML – “Binary Application Markup Language” – Binary Representation of XAML – More Efficient XAML – “XML Application Markup Language” – The Design Language of WPF – Tools will create XAML or Can be Hand coded BAML – “Binary Application Markup Language” – Binary Representation of XAML – More Efficient

17. Windows Presentation Framework: The Next GDI? New Development Model Lessons Learned From Web Development – Keep Design away from Developers – User Experience is Different than Design – Better Models a Three Tier Logical Model Lessons Learned From Web Development – Keep Design away from Developers – User Experience is Different than Design – Better Models a Three Tier Logical Model

18. Windows Presentation Framework: The Next GDI? Lessons Learned from Web Development Microsoft Tools for Designers & DevelopersMicrosoft Tools for Designers & Developers Declarative Programming through XAMLDeclarative Programming through XAML Third Party Tools (e.g. Aurora by Mobiform, ZAM 3D by Electric Rain)Third Party Tools (e.g. Aurora by Mobiform, ZAM 3D by Electric Rain) Designers design With XAML designers & developers can streamline their collaboration Developers add business logic

19. Windows Presentation Framework: The Next GDI? Design Tools Designers for different users – Visual Studio: Programmer Level  A WinForms-like experience – Expression Blend: Designer Level  Hybrid of Artist and Data Binding  Similar to HTML-level designing – Expression Design: Artist Level  An Illustrator-like experience Demo Designers for different users – Visual Studio: Programmer Level  A WinForms-like experience – Expression Blend: Designer Level  Hybrid of Artist and Data Binding  Similar to HTML-level designing – Expression Design: Artist Level  An Illustrator-like experience Demo

20. Windows Presentation Framework: The Next GDI? Programming Model (2) C#, VB.NET, etc. – Used to glue behavior with XAML/BAML – Think of XAML/BAML as the drawing code – CLR Languages still used to do heavy lifting C#, VB.NET, etc. – Used to glue behavior with XAML/BAML – Think of XAML/BAML as the drawing code – CLR Languages still used to do heavy lifting

21. Windows Presentation Framework: The Next GDI? Programming Model (3) XAML <window … /> BAML 000110101 101010001 101010… C#/VB.Net Partial class … WPF App Interpret Compile Combine

22. Windows Presentation Framework: The Next GDI? XML Based Markup (XAML) Elements tied to Controls (1 to 1) – is class Canvas – is class Window – is class Button – is class TextBox Elements tied to Controls (1 to 1) – is class Canvas – is class Window – is class Button – is class TextBox <Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> Click Me! <StackPanel xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> Hello There Click Me!

23. Windows Presentation Framework: The Next GDI? XML Based Markup (XAML) (2) Composite Controls – Simple hierarchy model – Content of most controls can store other controls Composite Controls – Simple hierarchy model – Content of most controls can store other controls <Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> Hello there

24. Windows Presentation Framework: The Next GDI? XML Based Markup (XAML) (3) Layout Models – Canvas: Specific Placement – StackPanel: Horizontal or Vertical Stacking – DockPanel: Control Docking (Explorer-like) – Grid: Guideline-based UI – TextFlow: Document Flow – Navigation: Web-like forward/back – Demo Layout Models – Canvas: Specific Placement – StackPanel: Horizontal or Vertical Stacking – DockPanel: Control Docking (Explorer-like) – Grid: Guideline-based UI – TextFlow: Document Flow – Navigation: Web-like forward/back – Demo

25. Windows Presentation Framework: The Next GDI? DataBinding Simple and powerful model – Target: any property of any Element – Source: public property of CLR objects:  CLR and XAML properties  ADO DataColumns (TypeDescriptor)  XML Node – Dynamic  IPropertyChange  DependencyProperty or;  PropertyDescriptor – TwoWay – Value Converter Simple and powerful model – Target: any property of any Element – Source: public property of CLR objects:  CLR and XAML properties  ADO DataColumns (TypeDescriptor)  XML Node – Dynamic  IPropertyChange  DependencyProperty or;  PropertyDescriptor – TwoWay – Value Converter

26. Windows Presentation Framework: The Next GDI? DataBinding (2) Binding Types – Simple Xml Syntax for Binding to Anything – Abbreviated Syntax also Supported Binding Types – Simple Xml Syntax for Binding to Anything – Abbreviated Syntax also Supported <Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" >

27. Windows Presentation Framework: The Next GDI? DataBinding (3) Support for Common DataSources – Uses a hierarchical DataContext concept Support for Common DataSources – Uses a hierarchical DataContext concept StackPanel Image HorizontalSlider Value= {Bind Path=XPos, Source={StaticResource theCar}} Canvas.Left= {Bind Path=XPos, Source={StaticResource theCar}} DataContext= {Bind Source={StaticResource theCar}} Value= {Bind Path=XPos} Canvas.Left= {Bind Path=XPos}

28. Windows Presentation Framework: The Next GDI? DataBinding (4) Binding Types – OneWay, TwoWay, OneTime – OneWay and OneTime work with any object  Property Based Reads – TwoWay uses IPropertyChange interface – Collections use ICollectionChange interface Binding Types – OneWay, TwoWay, OneTime – OneWay and OneTime work with any object  Property Based Reads – TwoWay uses IPropertyChange interface – Collections use ICollectionChange interface

29. Windows Presentation Framework: The Next GDI? Styles Similar to CSS, but can style structure – Inline Styling is supported – Defining Style of Control just works Similar to CSS, but can style structure – Inline Styling is supported – Defining Style of Control just works

30. Windows Presentation Framework: The Next GDI? Animation Animation Support is built in – Uses Storyboard idea for animation timelines Animation Support is built in – Uses Storyboard idea for animation timelines <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <DoubleAnimation Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width" From="100" To="200" Duration="0:0:5" AutoReverse="True" RepeatBehavior="Forever" />

31. Windows Presentation Framework: The Next GDI? Animation (2) More Complex Animation – Different Timeline Models (e.g. Parallel) More Complex Animation – Different Timeline Models (e.g. Parallel) <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <DoubleAnimation Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width" From="100" To="200" Duration="0:0:2" AutoReverse="True" RepeatBehavior="Forever" /> <DoubleAnimation Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Height" From="100" To="50" Duration="0:0:2" AutoReverse="True" RepeatBehavior="Forever" />

32. Windows Presentation Framework: The Next GDI? 3D Modeling Real 3D Modeling Language – Concepts like multiple cameras, lights, meshes and geometries are in the language. Real 3D Modeling Language – Concepts like multiple cameras, lights, meshes and geometries are in the language. <MeshGeometry3D x:Key="PlaneMesh" Positions="-1 -1 -0.5 1 -1 -0.5 -1 1 -0.5 1 1 -0.5 0 0 1" Normals="-1 -1 1 1 -1 1 -1 1 1 1 1 1 0 0 1" TextureCoordinates="0 1 1 1 0 0 1 0 0.5 0.5 " TriangleIndices="0 4 2 2 4 3 4 1 3 0 1 4" />...

33. Windows Presentation Framework: The Next GDI? Multimedia Support for simplified Audio/Video handling – – Simple wrappers around the Media Player APIs Support for simplified Audio/Video handling – – Simple wrappers around the Media Player APIs <Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="800" WindowState="Maximized">

34. Windows Presentation Framework: The Next GDI? Tools Perforator – Runtime view of WPF performance – Help to tweak performance – Very useful to test on a variety of platforms – Demo… Perforator – Runtime view of WPF performance – Help to tweak performance – Very useful to test on a variety of platforms – Demo…

35. Windows Presentation Framework: The Next GDI? Codename “WPF/E” WPF Everywhere – Microsoft’s Flash Killer – Uses XAML in the Browser – CTP Available Now – Version 1.0  Windows and Mac Support (Firefox, IE, Safari)  No.NET Runtime Needed  Runtime at 1 Meg currently  Programmatic Support via Jscript – Demo WPF Everywhere – Microsoft’s Flash Killer – Uses XAML in the Browser – CTP Available Now – Version 1.0  Windows and Mac Support (Firefox, IE, Safari)  No.NET Runtime Needed  Runtime at 1 Meg currently  Programmatic Support via Jscript – Demo

36. Windows Presentation Framework: The Next GDI? Conclusion WPF/XAML are the next GDI – Will they last 20 years? Probably not… – But they bring us into the GPU – And make better UI’s easier to write WPF/XAML are the next GDI – Will they last 20 years? Probably not… – But they bring us into the GPU – And make better UI’s easier to write

37. Questions?