Download - Introducing DirectComposition: Smooth composition and animations for desktop applications
Introducing DirectComposition: Smooth composition and animations for desktop applications
Silvana MoncayoProgram Manager4-021
Fast and Fluid
Agenda
What is DirectComposition?Why use DirectComposition?How to use DirectComposition• Learn best usage of the DirectComposition API• Build an application with a mix of existing and new
content
Windows composition engine• Start screen• Windows desktop apps• Windows store appsOptimized for usage with Direct2D, DXGI
What is DirectComposition?
Click icon to add picture
Key Platform APIs
Direct2D, DirectWrite
Direct3D
Dyna
mic
DPI
Desktop Applications
DirectComposition
Rem
aind
er o
f Win
32
Real
time
Styl
us
Ink
Reco
gniti
on
InteractionContext
WM_POINTER Family
DirectManipulation
Win32 apps
Windows Kernel Services
Input and Interaction Rendering and Composition
How does Windows use DirectComposition?
• Smooth animations, panning and zooming
• Best video playback experience• Interoperability with Win32
technologies• 2D and 3D transforms, clips and effects• Composition updates land atomically on
screen
DirectComposition is here to support your fast and fluid scenarios just like we have for Windows experiences!
Why use DirectComposition?
Demo: The power of DirectComposition
Direct2D bitmap
DXGI video
Direct2D HWN
D
Building a DirectComposition application
How to use DirectComposition1. Create DirectComposition device2. Create HWND composition target3. Set up the structure for the composition
visual tree4. Set up the content for the composition
visual tree5. Bind content and structure6. Create/set visual properties7. Create/set animations8. Commit
How to use DirectComposition1. Create DirectComposition device2. Create HWND composition target3. Set up the structure for the composition
visual tree4. Set up the content for the composition visual
tree5. Bind content and structure6. Create/set visual properties7. Create/set animations8. Commit
Device and HWND composition targetThe main DirectComposition object is the “device”LightweightFactory for all DirectComposition objectsCoordinates transactional behaviorMay be associated with a DXGI or D2D device for content updates
DirectComposition content must be bound to an HWNDTop level windowChild window
Two DirectComposition conceptual layers per windowOne below child windowsOne on top of child windows
ParentWindow
BottomDirectComposition
Layer
ChildWindow
TopDirectCompositio
nLayer
Composed Window
Composed window example
ParentWindow
ChildWindow
TopDirectComposition
Layer
Composed Window
Structure: Visuals and visual treeComposition Target for application window
Root Visual for Top DirectComposition layer
Container Visual
TopLeftTape Visual
TopRightTape Visual
BottomRightTape Visual
BottomLeftTape Visual
TopDirectComposition
Layer
Visual Studio1. Create DirectComposition device 2. Create HWND composition target3. Set up the visual tree
How to use DirectComposition1. Create DirectComposition device2. Create HWND composition target3. Set up the structure for the composition visual
tree4. Set up the content for the composition
visual tree5. Bind content and structure6. Create/set visual properties7. Create/set animations8. Commit
Visual’s Content: Composition surfaces
Four types of content:DirectComposition Surface• Logical surface - all pixels are realized in video
memoryDirectComposition Virtual Surface• Sparsely realized in video memory as needed
DXGI Swap Chain• Offers deep queuing of buffers + presentation
intervalsLayered Child Window• HWND-based content
DirectComposition visuals can be bound to different types of content
Content updates: Logical and Virtual Surfaces
• Need to be “checked out” for updates• BeginDraw/EndDraw paradigm to update
surface • Call BeginDraw to initiate update• Retrieve a DXGI surface or a D2D device context
and an offset• Draw updated contents at retrieved offset• Call EndDraw method to finish the update
• Nothing updates on screen until Commit is called
DirectComposition Surface and Virtual Surface can be updated via BeginDraw/EndDraw calls
Content updates: DXGI swap chain & layered child window • Content changes trigger a screen recomposition
independently of structural changes• DXGI swap chain updates when app calls “Present”• Layered child window updates when the app draws to
the window• “Commit” does not play a role for these types of
updates
Content updates are asynchronous for DXGI swap chain and layered child window
Visual Studio4. Create DirectComposition surface for tape5. Associate it with 4 child tape visuals
How to use DirectComposition1. Create DirectComposition device2. Create HWND composition target3. Set up the structure for the composition visual
tree4. Set up the content for the composition visual
tree5. Bind content and structure6. Create/set visual properties7. Create/set animations8. Commit
Visual properties• Offset• Clip • 2D affine transforms• Perspective transforms• Opacity• Interpolation and edge mode• Composite mode • Backface visibility
Visual Studio6. Position tape visuals appropriately via visual properties
How to use DirectComposition1. Create DirectComposition device2. Create HWND composition target3. Set up the structure for the composition visual
tree4. Set up the content for the composition visual
tree5. Bind content and structure6. Create/set visual properties7. Create/set animations8. Commit
DirectComposition AnimationLow level, flexible animation execution systemPiecewise function that maps time to one floating point valueEach segment is one of the following:
• Cubic polynomial• Sinusoidal• Repeat
Visual Properties: Every scalar setter has a corresponding animation setterAnimations end by replacing function with a constant scalar value
Visual Studio7. Animate container visual and its children tape
visuals8. Commit
Interoperability
HWND-based DirectComposition surface
Child windows are only composed while layered• Add Windows 8 compatibility to your manifest• Set the WS_EX_LAYERED style bit on the window• Call SetLayeredWindowAttributes with desired
constant alphaOR • Call UpdateLayeredWindow if per-pixel alpha is
needed
CreateSurfaceFromHwnd, bind Surface to Visual• Surface is just like a thumbnail -> 2nd instance of the
window
I already have my content, how do I make it part of my DirectComposition scene?
Animating HWND-based VisualUse Win32 HWND cloaking feature• Hides/shows the actual HWND
Use DirectComposition to animate HWND-based visual:• Create/Set DirectComposition animation• “Cloak” at the same time your animation starts• Use DwmSetWindowAttribute with “DWMWA_CLOAK” flag
• “Uncloak” at the same time your animation is done
Visual Studio• Layer web browser child window• Create/Set DirectComposition animation• Cloak/Uncloak layered browser child window• Animate DirectComposition HWND-based visual
Add engaging, smooth composition and animation scenarios to your application by using DirectComposition!
Move existing code forward without having to change rendering paths
You are ready to use DirectComposition!
ResourcesRelated BUILD Talks• 3-017: Power-up your Desktop app with Windows 8.1• 4-022: Make my desktop app great with touch, mouse, and
pen• 4-184: Making your desktop apps shine on high-DPI displays
DirectComposition documentation• http://msdn.microsoft.com/en-us/library/windows/desktop/hh437371(v=vs.85).aspx
DirectComposition SDK Samples• http://msdn.microsoft.com/en-us/library/windows/desktop/hh437367(v=vs.85).aspx
Evaluate this session
Scan this QR code to evaluate this session and be automatically entered in a drawing to win a prize!
© 2013 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.