SVG image support

[andrewleader]

Release	Renderer status	Tasks status
Not scheduled	🔄 .NET (#2468) 🔄 Android (#2469) 🔄 iOS (#2470) ✔️ TS (#2471) 🔄 UWP (#2228)	🔄 Shared (#2467) 🔄 Designer (#2543)

Summary

Many hosts and authors want to be able to use SVG images inside their cards. On most of our renderers, it isn't supported. Note that TS/HTML already supports it.

Asks

• Cortana
• Sets
• Action Center (Microsoft Teams and many more)
• xinguohenan

Proposal

In the Image element, simply allow SVG image sources. Update the renderers to display those properly.

Property	Type	Description
url	string	The URL to the image. Can be SVG format.

{
  "type": "Image",
  "src": "https://contoso.com/sample-svg-image"
}

Open questions

Can UWP properly display the SVG without being told it's a SVG? Or do we need the author to provide additional info?

Auto-generated task status

• [ ] Shared
• [ ] Designer
• [ ] .NET
• [ ] Android
• [ ] iOS
• [x] TS
• [ ] UWP

[dclaux]

Already supported in HTML renderer.

[andrewleader]

@RebeccaAnne in UWP, would the author have to tell us that it's a SVG? Since we're creating the XAML UI programmatically, I think we have to explicitly create a SvgImageSource rather than the traditional BitmapImage to display a SVG… but the problem is we don't know whether it's a SVG when we're only given a URL (the http url doesn't have to include an extension).

Can you try to confirm that we need additional info (like a property the author specifies to say it's a SVG)?

[RebeccaAnne]

@andrewleader, yes, looks like that's correct.

[matthidinger]

We should consider having the author specify a contentType as opposed to something like isSvg.

[khouzam]

We do have the mimeType for media. We can do the same for image types that might not be PNG & JPG.

[nayanaramakanth]

@andrewleader Is the SVG format supported for AdaptiveImage in Adaptive cards ? Please let know.

[klippas-rob]

It's been three long years - this feels like Waiting for Godot. What is the ETA?

[edlaver]

Would be nice if this could include image data uri support as well (as added with https://github.com/Microsoft/AdaptiveCards/issues/628), assuming it didn't just work by default once SVG support is implemented in general.