microsoft / microsoft/AdaptiveCards

SVG image support

Open
#777 8 comments 4 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Area-Inconsistency Area-Renderers Area-Schema Epic Proposal Request
Dominant language
C#
Stars
2k
Forks
595
Avg merge
1d 19h
Merged PRs (30d)
1

Description

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
  • TS
  • UWP

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up β€” it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by reviewing SVG handling for the Image element in the Shared, Designer, .NET, Android, iOS, and UWP renderers, comparing it with the existing TS/HTML support. Verify how each renderer displays the sample SVG source and resolve whether UWP needs additional author-provided information before the feature can be considered complete.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, csharp, ios, typescript
Domain
desktop, frontend, mobile
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.