WPF in 60 Seconds So Much WPF - So Little Time Acing the WPF Interview ;)

  • View
    233

  • Download
    4

Embed Size (px)

Text of WPF in 60 Seconds So Much WPF - So Little Time Acing the WPF Interview ;)

  • Slide 1

WPF in 60 Seconds So Much WPF - So Little Time Acing the WPF Interview ;) Slide 2 Overview Windows Presentation Foundation Slide 3 Purpose Cover all the topics Give an idea of what you can do oh yea, Ive seen that Dont stress on learning any of it Hopefully create a useful resource Slide 4 What is WPF MS latest greatest Desktop UI Framework GUIs in.Net Best of Web, Patterns, and Previous UI Frameworks UI Framework Released in.Net 3.0 (Nov 2006) Slide 5 Helpful Background.Net Used a control based UI Framework o VB6 o Windows Forms o ASP.Net o etc. Familiar with HTML or XML Slide 6 Why is WPF Great Visual 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.) Slide 7 WPF Vs. Silverlight More features Fewer restrictions No band-aids or black holes Desktop Only Devblog.Ailon.Org Slide 8 Tools Visual Studio (2008, 2010) Expression Blend (3/4) ReSharper (auto adds references +++) Snoop (WPF/free) Silverlight Spy (paid) Slide 9 Core WPF Slide 10 Structure of a WPF App Create with VS New WPF Application App.XAML o StartupUri="Window1.xaml" o Resources o Subclass of Windows.Application Window1.xaml o ctor: InitializeComponent(); o Subclass of Windows.Window Slide 11 XAML All roads in WPF lead to XAML Specialized XML Creates Visuals like HTML Controls Control Templates Extensions for binding Resource Dictionaries Bindings normally defined here Compiles to BAML Slide 12 Controls Panels - Multiple Children Canvas Grid StackPanel DockPanel Wrap Panel UniformGrid VirtualizingPanel VirtualizingStackPanel Controls ItemsControl "Single" Child Control Button CheckBox Radio Button ToggleButton WPF Toolkit - CodePlex out of band releases Slide 13 Grid Common lightweight layout container Column Width Auto: fit to contents *: take up the rest of the space #*: proportional spacing Slide 14 Dependency Object / Property DO's have DP's Dependency Objects / Controls For Binding Target in Controls INotifyPropertyChanged is code lighter for source binding in VMs For Event Routing and Property Inheritance Slide 15 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 Slide 16 MVVM (P) 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 Slide 17 MVVM Details Presenter ViewModel View DataContext Dispatcher Slide 18 Binding Cheat Sheet DataContext ItemsSource Scenarios Direct Element Ancestor Multi-Level (target.element.element) Requriements For Handling Updates INotify (ObservableCollection) DependencyObject 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 type will set null FallbackValue -- rarely used Slide 19 Resource Dictionary x:Name x:Key StaticResource DynamicResource ResourceDictionary.MergedDictionaries Control.Resources Scoping, Cascade Effect Slide 20 Advanced Binding Fallback Value PriorityBinding Design Time ViewModel Slide 21 Styles (are not Templates) Though they can be skins. Slide 22 Templates DataTemplate ItemTemplate ControlTemplate Template Selectors vs. DataTemplates Slide 23 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 Slide 24 Triggers DataTriggers Property Triggers Event Triggers Multi-Triggers http://www.wpftutorial.net/Triggers.html Slide 25 Converters Change VM data into UI friendly ex: rename row 0 to row 1 casing Can work as Template Selectors Color Coders etc. CodePlex IValueConverter IMultiValueConverter Need to put in Resource Dictionary Ex: Slide 26 Commanding - Making it Go Slide 27 More Topics Slide 28 Data Validation IDataErrorInfo Requires annoyingly verbose binding syntax, but otherwise quite serviceable Slide 29 Logical and Visual Trees Snoop Slide 30 Threading Important, but rarely an issue Dispatcher Task RX Slide 31 Animations DoubleAnimation: change a double value Duration RepeatBehavior Slide 32 Prism & Unity Slide 33 PrismPrism / Unity: Composite Apps Composite Application Guidance for WPF and Silverlight Regions Event Aggregator Catalog (IoC): Unity Also: logging interfacelogging 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. Slide 34 Composite Bootstrapper WPF Hands-On Lab: Getting Started with the Composite Application Library Shell.XAML Regions: o ContentControl or ItemsControl o Selector/TabControl Bootstrapper o CreateShell o GetModuleCatalog App.OnStartup Slide 35 Prism Module Module: C# Class Library Module: IModule o Initialize Views o each application UI piece is usually a UserControl Populate Catalog with Modules o o From code most straightforward possibly most common o o From a XAML file o From a Configuration file o From a Directory Slide 36 Regions Specified in XAML and IModules RegionManager Injected in Module Ctor o DemoModule(IRegionManager regionManager) Initialize sets regions o _regionManager.RegisterViewWithRegion("MainRegion ", typeof(Views.HelloWorldView)); Slide 37 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 ().View ); Base interfaces and classes in WPF60.Infrastructure.CabSupport