470 likes | 692 Views
WPF in 60 Seconds. So Much WPF - So Little Time Acing the WPF Interview ;). Overview. Windows Presentation Foundation. Goals. Cover all WPF topics (impossible) Show some of what WPF can do Show how WPF works Create a useful resource. MS latest greatest Desktop UI Framework
E N D
WPF in 60 Seconds So Much WPF - So Little Time Acing the WPF Interview ;)
Overview Windows Presentation Foundation
Goals • Cover all WPF topics (impossible) • Show some of what WPF can do • Show how WPF works • Create a useful resource
MS latest greatest Desktop UI Framework Best of Web Style and Previous UI Frameworks UI Framework Released in .Net 3.0 (Nov 2006) The future of Windows Desktop Applications The 2nd best Windows GUI framework Declarative “Easily” separates GUI and business logic Feature rich What is WPF
Helpful Background • .Net 3.0, Visual Studio • Used a UI Framework with controls • VB6 • Windows Forms • ASP.Net • etc. • Familiar with HTML or XML
Why is WPF GreatVisual Flexibility, Quick Results, Great Features • Auto Sizing, Auto Positioning Layout • Templating • Styles: similar in concept to CSS: allow skinning • Convenient (once you get the hang of it) Feature Rich Binding • Triggers, Animation • Property Inheritance • Attached Properties • Bubbling & Tunneling Events • XAML is like HTML: its easy to create UIs visually and in markup • Rich UI Control: positioning, gradients, layering/opacity, etc. • Compositional Controls: (pictures in buttons, buttons in lists, no problem, lists in buttons, with pictures, etc.)
WPF Will Drive You Crazy • Can’t find the super fantastic way to do something simple you know exists • Visual Studio and Blend crash several times daily • VS and Blend inexplicably slow • Binding failures can be truly silent • So many details and moving parts • So many
WPF Vs. Silverlight • More features • Fewer restrictions • No band-aids or black holes • Desktop Only Devblog.Ailon.Org
WPF Vs. WinForms • Winforms: still more third party controls available • Otherwise, no contest • WinForms is dead to me. RIP.
Tools • Visual Studio (2008, 2010) • Expression Blend (3/4) • ReSharper (auto adds references +++) • Snoop (WPF/free) • Silverlight Spy (paid) • Rooler?
Structure of a WPF App • Create with VS New WPF Application • Window1.xaml • .xaml, .cs code behind • ctor: InitializeComponent(); • Subclass of Windows.Window
XAMLAll roads in WPF lead to XAMLeXtensible Application Markup Language • pronounced “zammel” • Specialized XML • Creates Visuals like HTML / ASP.Net • Code behind • Compiles to BAML • {} for Binding
Resource Dictionary • Resources to use in Xaml • ResourceDictionary.MergedDictionaries • x:Key (optional vs. Type) • x:Type • DynamicResource / StaticResource • Control.Resources • Scoping, Cascade Effect
Controls • All the UI standard controls • Composable • Content property
Controls - Panels • Hold multiple children
Controls • Controls • ItemsControl • "Single" Child Control • Button • CheckBox • Radio Button • ToggleButton • WPF Toolkit - CodePlex • out of band releases Panels - Multiple Children • Canvas • Grid • StackPanel • DockPanel • Wrap Panel • UniformGrid • VirtualizingPanel • VirtualizingStackPanel
Controls • Controls • ItemsControl • "Single" Child Control • Button • CheckBox • Radio Button • ToggleButton • WPF Toolkit - CodePlex • out of band releases • Button • ToggleButton
Grid • Common lightweight layout container • Column Width • Auto: fit to contents • *: take up the rest of the space • #*: proportional spacing
Dependency Object / Property DO's have DP's Dependency Objects / Controls • Required For • Binding Target in Controls • INotifyPropertyChanged is code lighter for source binding in VMs • For Event Routing and Property Inheritance • Saves space as unused properties don’t take up space and each UI object can have hundreds of them • Ex of prop inheritance • Allows attaching properties to other objects, like Grid.Row • Can use the Get/Set because it doesn’t run from UI Binding
UI Features • Gradients • Geometries • Lines • CornerRadius • Transparency • Overlap (xaml order, z-order) • Rotation • Resize • Alignment: Left, Right, Top, Bottom, Stretch • Vector Graphics – resize looks great • Resolution Independence (dips – 96 dips/inch) • 3D
Standard Properties • Margin / Padding “L T R B” • Fill • Border • Text Properties • Transforms • Alignment top/bottom, left/right, center, stretch • IsTabStop
Preferred Pattern for XAML apps (builds on MVP, MVC, XYZ) Enhances testability, separation of concerns Controls are generally not named to favor binding MVP style is often used when needing to reference controls in code -- either publish a method on an interface of the view or make a control visible to code via a property. Prime example XamDataGrid that has specific loading API that can't be bound MVVM (P)
MVVM Details • Presenter • ViewModel • View • DataContext • Dispatcher
Binding • Binding Failure • "Helpfully" doesn't crash your app or throw exception • See Results in the Output Window • Or it can truly fail silently: ex: mismatched IList<T> type will set null • FallbackValue -- rarely used • Cheat Sheet • DataContext • ItemsSource Scenarios • Direct • Element • Ancestor • Multi-Level (target.element.element) Requriements For Handling Updates • INotify (ObservableCollection) • DependencyObject
Resources • Key • Style • TargetType • Setter, Property, Value • Brush, DataTemplate, etc.
Advanced Binding • Fallback Value • PriorityBinding • Design Time ViewModel
Styles (are not Templates) Though they can be skins.
Templates DataTemplate ItemTemplate ControlTemplate Template Selectors vs. DataTemplates
Context • UserControl – set datacontext of sub-element to UserControl (essentially code behind) • Template – uses instance binding • View – uses ViewModel because UserControl DataContext will be set to VM
Triggers • DataTriggers • Property Triggers • Event Triggers • Multi-Triggers • http://www.wpftutorial.net/Triggers.html
Converters • IValueConverter • Convert • ConvertBack (rarely used) • IMultiValueConverter Need to put in Resource Dictionary Change VM data into UI friendly ex: • rename row 0 to row 1 • casing Can work as • Template Selectors • Color Coders • etc. • CodePlex
Data Validation IDataErrorInfo Requires annoyingly verbose binding syntax, but otherwise quite serviceable
Logical and Visual Trees Snoop
Threading • Important, but rarely an issue • Dispatcher • Task • RX
Animations • DoubleAnimation: change a double value • Duration • RepeatBehavior
Prism / Unity: Composite Apps Composite Application Guidance for WPF and Silverlight • Regions • Event Aggregator • Catalog (IoC): Unity Also: logging interface Microsoft.Practices.ServiceLocation.dll. This assembly contains the Common Service Locator interface used by the Composite Application Guidance to provide an abstraction over Inversion of Control containers and service locators; therefore, you can change the container implementation with ease.
Composite Bootstrapper WPF Hands-On Lab: Getting Started with the Composite Application Library • Shell.XAML • Regions: • ContentControl or ItemsControl • Selector/TabControl • Bootstrapper • CreateShell • GetModuleCatalog • App.OnStartup
Prism Module • Module: C# Class Library • Module: IModule • Initialize • Views • each application UI piece is usually a UserControl • Populate Catalog with Modules • From code • most straightforward • possibly most common • From a XAML file • From a Configuration file • From a Directory
Regions • Specified in XAML and IModules • RegionManager Injected in Module Ctor • DemoModule(IRegionManager regionManager) • Initialize sets regions • _regionManager.RegisterViewWithRegion("MainRegion", typeof(Views.HelloWorldView));
Presenters, VMs, Base Classes, etc. • IModule.Initialize • Register type mappings – supports mocking view, vm • Create Presenter and register view into region: _regionManager.Regions[Regions.MainRegion].Add( _container.Resolve<CoolIntroPresenter>().View ); • Base interfaces and classes in WPF60.Infrastructure.CabSupport
Acknowledgements • Thanks to Lab49 • Eugene & Jason • Channel9