A Jumpstart to WPF by Kevin Grossnicklaus ArchitectNow

2. A Jumpstart to WPFby Kevin GrossnicklausArchitectNow

4. Agenda • Introduction • What is WPF? • Resources • XAML • Advanced Topics • Expression Blend • Silverlight? • Conclusion/Questions

5. Introduction • Kevin Grossnicklaus • ArchitectNow-www.ArchitectNow.net (2009-Present) • President • Washington University - CAIT Program (2003-Present) • Instructor • SSE - www.SSEinc.com (1999-2009) • Chief Architect • Software Development Practice Leader • Email: kvgros@architectnow.net

6. What is WPF?

7. Windows Presentation Foundation (WPF)? • User interface framework for Windows platforms • Replaces WinForms • WinForms = Traditional .NET Windows Application framework • Released in 2006 with the .NET 3.0 (NetFX) distributable • Designer support built into: • Visual Studio.NET 2005 (via Plug-In) • Visual Studio.NET 2008 (natively) • Visual Studio.NET 2008 SP1 (natively) • Visual Studio.NET 2010 (natively) • New set of controls and rendering engine • Requires Windows

8. Windows Presentation Foundation (WPF)? • WPF UI’s traditionally “declared” in XAML (more on this later) • Separation of UI and code • Better support for powerful graphic capabilities of newer hardware • Vector vs. Bitmap graphics • Scaling • Enhanced controls and control composition • Many improvements over the years of effort invested in traditional Windows development technologies

9. WinForms vs WPF • Both… • …used to develop rich, client-side interfaces • … are extensible through custom controls • …promote a WYSIWYG design experience • …take advantage of the local client resources • …provide a significant number of controls and widgets used to build up interfaces • Both built-in and 3rd party • …sit on top of the MFC classes that make up the current Windows implementation

10. WinForms • Generally designed with manual layout of controls at fixed sizes and positions • Generally supports the “traditional” grey UI typical of most current LOB applications • Essentially a port of the traditional VB6 Windows development model to the .NET Framework • Lacking in many areas • Support for resolution independence • Difficult to modify look or behavior of “built-in” controls • No support for many of Windows common actions (i.e. cut, copy, paste) • Difficult to localize • Difficult to represent documents • Difficult to represent animations and other media rich content

11. WPF • UI’s built through composition of various containers • Containers determine the layout and sizing of children • UI’s defined in external XML based file format called XAML • Applications built with a mixture of XAML UI declarations and .NET code behind files • Supports a much cleaner and more extensible model for UI widgets than WinForms • Significantly enhanced built-in controls

12. WPF (Cont.) • Full application styling • Better localization support • Resolution independence (due to vector based nature of controls) • Integrated command pattern for custom commands or common Windows commands • “Lookless” controls that allow for any controls look and feel to replaced • Full Ink and Tablet support out of the box • Currently being enhanced and extended • Etc, etc…

13. WPF: Creating a Simple Application

14. WPF and XAML REsources

15. WPF Resources • Links: • www.WindowsClient.net • www.CodeProject.com • www.CodePlex.com • http://www.codeproject.com/kb/wpf/ • http://Wpf.codeplex.com • Control Browser: http://mtaulty.com/CommunityServer/blogs/mike_taultys_blog/archive/2009/02/03/silverlight-wpf- control-browser.aspx • LearnWPF.Net • http://learnwpf.com/Default.aspx • Books:

16. WPF Tools • Visual Studio.NET 2008 SP1 • Microsoft Expression Blend (Version 2.0 or 3.0) • http://www.microsoft.com/expression/ • KAXAML • http://www.kaxaml.com/ • Tools Links: • http://blogs.msdn.com/mswanson/articles/WPFToolsAndControls.aspx • CompositeWPF: • http://compositewpf.codeplex.com/

17. WPF Examples • Family.Show • http://www.vertigo.com/familyshow.aspx • http://www.codeplex.com/familyshow (Code) • Woodgrove Financial • http://scorbs.com/workapps/woodgrove/FinanceApplication.xbap • VantagePoint Demos • http://www.mobiform.com/VantagePointDemo/VantagePointDemo.xbap • Showcase Projects • http://windowsclient.net/community/showcase.aspx

18. Intro to Xaml

19. XAML • XAML = eXtensible Application Mark-up Language • Rhymes with “Camel” • XML syntax for declaring runtime object model (and properties of any object) • Supports hierarchical object model instantiation • XAML can be used to represent any object • XAML content is kept in separate files in your VS.NET Projects with the extension of .XAML. This content is embedded into your projects as resources and then read and parsed at runtime. • XAML IS NOT SPECIFIC TO WPF…WPF TAKES ADVANTAGE OF XAML!

20. Syntax System.Windows.Controls.Button b = new System.Windows.Controls.Button(); b.Click += new System.Windows.RoutedEventHandler(button_Click); b.Content = “OK”; Vs. <Button Content=“OK” Click=“button_Click>

21. Syntax 2 System.Windows.Controls.Button b = new System.Windows.Controls.Button(); System.Windows.Shapes.Rectangle r = new System.Windows.Shapes.Rectangle(); r.Width = 40; r.Height = 40; r.Fill = System.Windows.Media.Brushes.Black; b.Content = r; Vs. <Button> <Button.Content> <Rectangle Height=“40” Width=“40” Fill=“Black” /> </Button.Content> </Button>

22. WPF Containers • Relative vs. Fixed Positioning • Nesting of Controls • Some Common WPF Containers: • StackPanel • Canvas • DockPanel • TabControl • Grid • WrapPanel

23. XAML DEMO

24. Advanced Xaml Concepts

25. Some Advanced XAML and WPF Concepts • Attached Properties • Markup Extensions • Resources • Commands • DataBinding • Control Composition • Transforms • Styles

26. Expression Blend

27. Microsoft Expression Blend • Tool in the new Microsoft Expression suite of designer packages • Full support for Visual Studio.NET project and solution files • Graphic designer focused tools for editing XAML files

28. WPF and SILVERLIGHT

29. WPF and Silverlight • Silverlight is a Browser Plug-in that renders XAML and supports a significant portion of the full WPF functionality • Full WPF is limited to Windows desktops with the .NET 3.0+ Framework • Silverlight runs on Mac OSX, Windows, and Linux (via Moonlight) • Both: • Are heavily built around XAML • Have significant built-in designer support within Visual Studio.NET • Can take advantage of external tools like Expression Blend for UX design • UI’s built for the full WPF can many times be pasted into Silverlight applications

30. What’s next?

31. Questions?kvgros@architectnow.net

32. Conclusion Thank you for coming!