locked
[Metro apps] How to load SVG image file. RRS feed

  • Question

  • As I concern, .NET 4.5 does not provide any standard way to load a SVG image. Is that true ?
    Tuesday, June 5, 2012 9:23 AM

Answers

  • .NET 4.5 does, but the .NET APIs for Metro style apps does not currently have support for SVG images.


    • Edited by Brian Hilstrom Tuesday, June 5, 2012 5:40 PM clarification
    • Marked as answer by Emi Smith Thursday, June 7, 2012 2:19 AM
    Tuesday, June 5, 2012 5:40 PM
  • SVG is supported for Windows Store apps written in HTML and JavaScript. Windows Store apps written in Xaml use Xaml for their vector format. I believe InkScape can export XAML as well as SVG. You will need to be careful about using features such as gradients which are supported in Xaml for WPF but not for Xaml in Windows Store apps.

    --Rob

    Monday, December 10, 2012 8:38 PM
    Moderator

All replies

  • .NET 4.5 does, but the .NET APIs for Metro style apps does not currently have support for SVG images.


    • Edited by Brian Hilstrom Tuesday, June 5, 2012 5:40 PM clarification
    • Marked as answer by Emi Smith Thursday, June 7, 2012 2:19 AM
    Tuesday, June 5, 2012 5:40 PM
  • Is it support now in RTM version of Windows 8?

    In http://msdn.microsoft.com/en-us/library/windows/apps/hh780612.aspx, It says as follows but I cannot import the svg.

    Provide vector or high-resolution assets.

    The scale-to-fit technique scales your application to varying sizes up to 200% of the design size for your app on a large desktop monitor.

    Vector assets like Scalable Vector Graphics (SVG), XAMLExtensible Application Markup Language (XAML), or design primitives scale without scaling artifacts or blurriness. If raster assets (such as bitmap images) are required, provide images that are twice as large as the design size so they can be scaled down instead of scaled up.

    The following images demonstrate how scalar images (right) degrade when scaled up in size compared to vector images (left).+"

    Monday, September 10, 2012 12:34 PM
  • Is it support now in RTM version of Windows 8?

    In http://msdn.microsoft.com/en-us/library/windows/apps/hh780612.aspx, It says as follows but I cannot import the svg.

    Provide vector or high-resolution assets.

    The scale-to-fit technique scales your application to varying sizes up to 200% of the design size for your app on a large desktop monitor.

    Vector assets like Scalable Vector Graphics (SVG), XAMLExtensible Application Markup Language (XAML), or design primitives scale without scaling artifacts or blurriness. If raster assets (such as bitmap images) are required, provide images that are twice as large as the design size so they can be scaled down instead of scaled up.

    The following images demonstrate how scalar images (right) degrade when scaled up in size compared to vector images (left).+"

    as mentioned above, is this now true? I can't find any documentation or examples on how to do this.

    I'm trying to use an SVG image created in Inkscape as the background.

    • Edited by NathanT85 Monday, December 10, 2012 10:01 AM
    Monday, December 10, 2012 9:50 AM
  • SVG is supported for Windows Store apps written in HTML and JavaScript. Windows Store apps written in Xaml use Xaml for their vector format. I believe InkScape can export XAML as well as SVG. You will need to be careful about using features such as gradients which are supported in Xaml for WPF but not for Xaml in Windows Store apps.

    --Rob

    Monday, December 10, 2012 8:38 PM
    Moderator
  • SVG is supported for Windows Store apps written in HTML and JavaScript. Windows Store apps written in Xaml use Xaml for their vector format. I believe InkScape can export XAML as well as SVG. You will need to be careful about using features such as gradients which are supported in Xaml for WPF but not for Xaml in Windows Store apps.

    --Rob


    brill, that's cleared it up for me. I'm going to have a play with Expression Design 4 to see what sort of XAML images I can create.
    Monday, December 10, 2012 8:53 PM
  • How did you come on with creating Xaml vectors for windows 8 store apps?

    I have little experience with windows 8 store app xaml; however I've been creating vectors for wpf for sometime now. Expression Design 4 is very good for exporting to wpf resource dictionary or the Silverlight route if you prefer. Though I have to say out of all of them the export to DrawingBrush for wpf is by far the superior choice. You aren't restricted by canvas sizing and so vectors are scaled correctly what is displaying the graphic is resized. Nor do you have to deal with a render transform.

    Did you find a route for windows 8 store apps that is just as capable? In the next year we are considering moving more towards windows 8 for our development and this is an area that interests me greatly.

    Wednesday, February 13, 2013 12:22 PM
  • Standard way? Not yet. But you can load svg file using XAML, using XSLT transformation. (In Window Store App we use: Windows.Data.Xml.Xsl.XsltProcessor.

    I put down these words because it take me few days to have a right way to deal with it.

    My extremely useful reference was: http://wrb.home.xs4all.nl/Articles/Article_SVGToXAML_01.htm

    Thank the author so much!

    Hope everyone who have to do something with svg file in Windows store app will have a quick solution, not like me. :D


    Tuesday, June 11, 2013 3:41 AM