Upload
goodfriday
View
1.242
Download
1
Tags:
Embed Size (px)
Citation preview
Yahoo! on Microsoft .NET 3.0 and Microsoft ExpressionJosh JacobsonSr. Product ManagerYahoo!
Eric BurkeSr. Technical Yahoo!Yahoo!
Yahoo! Messenger for Windows Vista
Today
Why is Yahoo! Here?Demo
WPF Secrets REVEALED!Q&A
Wednesday 10 am
Frog Design + Yahoo!
Designer / Developer Workflow
Sketches & Prototypes
Common Platform, Native Interfaces
Win
dow
s X
P
Mac
OS
X
Oth
ers
…
Win
dow
s V
ista
Yahoo! Client Platform
Messenger Client Platform
Overview
Getting started with WPFApplication ModelDeveloper-Designer workflowWindow.AllowsTransparency: friend or foe?UserControls are (usually) good!What’s wrong with my ListBox?But i have all this existing C++ code…Data BindingOther tidbits
Getting Started with WPF
Make heavy use of forums, blogs, etc. Provide small repro code if possible!
Expect to do heavy refactoring of your work for a good 3-6 months or more
Write a photo viewer, RSS reader, and/or a sidebar with widgets
Use everything in the SDK at least once
Remember: this is 1.0 software!
Getting Started (cont’d)
Code first, XAML later
Understand what’s going on under the hood
Look in obj/ for files with the “.g.cs” extension
Petzold’s book (Applications = Code + Markup) teaches code first – excellent read
Rob Relyea (MSFT, http://rrelyea.spaces.live.com/) is writing a XAML-to-Code converter
Application ModelModelowned by developerapp logicraw data sourcesunmanaged codeC#, C++, etc.
ViewModelowned by developerheavy input from designertransform/augment dataused mainly to support bindings in UI
mostly in C#
Viewowned by designercontains the UImostly in XAML
Developer-Designer Workflow
Dev: build first cut of app
Dev: implement ViewModel changes and integrate
prototypes
Design: build prototypesDesign: apply styling using tools and request ViewModel
changes
Designer-Developer Workflow
Get designers using Blend
Designers (generally) don’t want to write XAML by hand – too slow
For optimal workflow, make sure your project always loads in Blend
Factor if necessary using UserControls and helper projects
Window Transparency
WPF Rendering:AllowsTransparen
cy=“False”
Render using
DirectX Pipeline
Windows XP: draw
directly to screen
Windows Vista:
draw to a shared surface managed by
the DWM
Window Transparency (cont’d)
WPF Rendering:AllowsTransparen
cy=“True” on Windows XP
Call UpdateLayeredWindow() with
a DC
Oh, no! IDirect3DSurface:
:GetDC() fails if alpha channel!
Fall back to software rendering
Window Transparency (cont’d)
WPF Rendering:AllowsTransparen
cy=“True” on Windows Vista
Hooray! IDirect3DSurface:
:GetDC() works
with alpha channels; render
with h/w
Oh, no! GDI is software
emulated on Vista!
Must move bits from video
memory to main memory (can be
sloooooow)
Window Transparency (cont'd)
Conclusions
on XP, complex scenes hurt performance
on Vista, slower system bus and large windows hurt performance (“large” may not be as big as you think!)
Window Transparency (cont'd)
WorkaroundsOpaque window with custom HRGN
Overlapped “owned” windows to create illusion of a nonrectangular window[added advantage: better Maximize behavior]
Use Popup classCaveat: always on topCaveat: forces itself to stay onscreen
UserControls
Problem: XAML file size gets unwieldy FASTHard to maintain the codeHard to find what you needTools can’t handle crazy file sizes
UserControl is a custom “black box”Different than a custom ControlUsed for specific purpose in the given project
UserControls
Faster time-to-build
Componentization means UI can be laid out top-down with placeholders
Can live in a separate project
Smaller, so tools can handle them more easily
Makes iterating and testing far easier
Makes life easier on designers!
ItemsControls: VirtualizationOften ItemsControls (e.g., ListBox) will have many more items than can be displayed
Virtualization: creating physical representation for only the visible items
Default behavior of ItemsControl uses VirtualizingStackPanel
As list is scrolled, items coming into view get created; items which are no longer in view get destroyed and collected
ItemsControls: Virtualization (cont’d)
Problem #1: using a non-virtualized ItemsPanele.g., WrapPanel, Grid, etc.Currently, .NET framework includes only VirtualizingStackPanel
Solution: write a custom VirtualizingPanel as the ItemsPanel
Dan Crevier (MSFT, http://blogs.msdn.com/dancre/) has a great example of a VirtualizingTilePanel
ItemsControls: Virtualization (cont’d)
Problem #2: grouping data using CollectionViewSource
View treats each Group as one itemItemsControl has no knowledge of Group’s contents
Solution: custom CollectionView subclassReplace default ListCollectionViewCustom View plays nice with virtualizationNot a trivial exercise, but gives you better control
Interop: Why do you need it?
Legacy C++ code
Cross-platform C++ code
Functionality not in WPF (e.g., GetCursorPos)
Want to leverage WPF in your WinForms app, or vice-versa
Use existing non-WPF third-party controls
Interop: C++/CLI
AKA “Managed C++” – .NET and C++ in same DLL
Exposes .NET classes to the app
App can subclass or bind directly to these classes
Communicates with underlying unmanaged code
Example: Yahoo! Messenger core components
Interop: P/Invoke
Call C++ library functions from .NETDIBs, window regions, DWM, ShellExecute, Set/GetWindowLong
Legacy C++ libs
Make use of http://www.pinvoke.net/ (Adam Nathan, MSFT, http://blogs.msdn.com/adam_nathan/)
[DllImport("dwmapi.dll", PreserveSig = false)]
public static extern void DwmExtendFrameIntoClientArea(
IntPtr hwnd, ref MARGINS margins);
Interop: Windows Forms
Host Windows Forms controls in WPFuse WindowsFormsHost to host the controluse PropertyMap to translate property values between WF and WPFcommon usage: WebBrowser control
Host WPF content in WFuse ElementHost to host a WPF UIElementuse PropertyMap to translate property values between WPF and WF
Interop: ActiveX
uses AxHost (Windows Forms control)
Build managed wrapper using AxHost subclassoption 1: reference ActiveX control in VSoption 2: run AxImp.exe manually
Windowed controls are a “black box” – no opacity
Windowless controls work well
Data Binding Tips
Think data, not codeStructure your data to facilitate binding
Add transforms or helper properties/methods to the ViewModel layer
Example: Buddy.DisplayText logic
Subclass standard collections to add helper properties/methods
Example: BuddyCollection.this[string]
Data Binding Tips (cont’d)
INotifyPropertyChangeduse this for most binding sources
DependencyPropertyuse when the property is a binding *target* or is animatede.g., MyProperty=“{Binding Path=Foo}”
INotifyCollectionChangeduse to bind to a list of data itemse.g., ObservableCollection<T>
Data Binding Tips (cont’d)
XmlSerializer is (often) your friend
Deserialize an XML stream into objects
Avoids using XPath over and over
Use xsd.exe (SDK tool) to generate classes for you from XML schema or raw data
Example: Yahoo! search APIs
Data Binding Tips (cont’d)
CollectionViewSource / CollectionView
Provides data navigation (“CurrentItem”)
Supports sorting and grouping
Bind multiple controls to one navigator
Attached Properties
Use when you want to set properties on items of a type other than the type that defines the property
Common usage: layout(e.g., DockPanel.Dock, Grid.Row, Grid.Column)
Extend functionality without subclassing
Technically you don’t need attached properties, but it allows you to use XAML
Other Tidbits
Use merged ResourceDictionaries
Equivalent to “#include” for ResourceDictionary
Allows use of multiple ResourceDictionary XAML files for maintainability
Share styles and resources across projects
Example: Yahoo! Messenger and Frog Design
Other Tidbits (cont’d)
Leverage WPF’s command framework
Encapsulates functionality
Supports keyboard accessibility (InputBindings)
Allows developer or designer to add more entrypoints easily
Works across classes and assemblies
Does not burden designers with specific function names, etc.
Tools and Resources
Light WSIWYG XAML editors
XamlPad, XamlPadX, KaXaml, XamlCruncher
No code, just XAML
Quick UI testing/building
Helps you learn how to do tricks in XAML
Good for sending repro to others
Tools and Resources
Expression "Blend" (MSFT)
Designer: build the UI, animations, prototypes, styles; work with full apps
Developer: use for quick styles, templates, animations; test UserControls
Multiple source files, complex projects
Available in Expression Studio box received at MIX
Tools and Resources (cont’d)
Snoop (Peter Blois, MSFT)
Basically Spy++ for WPF
Allows you to examine the visual tree
Make some property changes live if you need to tweak
Magnify the UI
Inspect events and binding errors
Download from http://www.blois.us/Snoop/
Tools and Resources (cont’d)
Reflector (Lutz Roeder, MSFT)
Dig into the disassembly for .NET classes
Many cool add-ins (incluing a XAML resource viewer)
Download application and add-ins from http://www.aisto.com/roeder/
Crave more?Q&A Now with Josh & EricOther members of the team hereGet notified http://messenger.yahoo.com/vistaWednesday session with Frog Design 10am
Palazzo MMessenger blog:
http://blog.messenger.yahoo.com
Eric’s blog: http://eric.burke.name/dotnetmaniaEric’s email [email protected]
© 2007 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions,
it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.