1. Vector iconography: Using SVG images in your app
12/3/2018 1:13 AM
P4078
Vector iconography: Using SVG images in your app
Rick Manning
Program Manager
© Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

2. Why SVG is awesome Bitmaps: Need multiple sizes Static at runtime
Vector images:
One image for all scales
Dynamic manipulation

3. New in Creators Update: In-app SVG support!
XAML: Easily display SVG images with <Image>
Direct2D: Parse, render, and manipulate SVG
Win2D: coming this summer!
Still important:
SVG in HTML apps and the XAML WebView control
OpenType SVG fonts

4. Demo Easy SVG images with XAML 12/3/2018 1:13 AM
© Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

5. Capabilities and limitations
Graphically-focused subset of SVG
No extensibility, scripts, or external references
No declarative animation or input events
Use HTML or XAML WebView for browser-grade support

6. Demo SVG manipulation with Direct2D 12/3/2018 1:13 AM
© Microsoft Corporation. All rights reserved. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

7. Next steps Install the Windows 10 SDK Try out SVG in your app
Learn more:
SDK sample: Direct2D SVG image rendering
MSDN reference: Direct2D SVG Support
Tell us what you think!
wpdev.uservoice.com
Thanks for watching!