SvgImageSource icon indicating copy to clipboard operation
SvgImageSource copied to clipboard

Doesn't correctly display a gradient from an SVG

Open rfernandez opened this issue 3 years ago • 0 comments

Hi, I am using your library. Great work! I have a problem displaying an SVG with a gradient color. This is my SVG:

<svg id="icon_profile" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="25" height="25" viewBox="0 0 25 25">
  <defs>
    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
      <stop offset="0" stop-color="#00f1ac"/>
      <stop offset="1" stop-color="#1c41da"/>
    </linearGradient>
  </defs>
  <path id="Trazado_10461" data-name="Trazado 10461" d="M25,12.5A12.5,12.5,0,1,0,6.421,23.419a.416.416,0,0,0,.089.05,12.48,12.48,0,0,0,11.979,0,.415.415,0,0,0,.089-.05A12.509,12.509,0,0,0,25,12.5ZM.833,12.5A11.667,11.667,0,1,1,18.75,22.347V20a6.274,6.274,0,0,0-3.1-5.4.419.419,0,0,0-.437.01,5.057,5.057,0,0,1-5.418,0,.419.419,0,0,0-.437-.01A6.274,6.274,0,0,0,6.25,20v2.347A11.668,11.668,0,0,1,.833,12.5Zm6.25,10.33V20a5.439,5.439,0,0,1,2.481-4.546,5.9,5.9,0,0,0,5.871,0A5.439,5.439,0,0,1,17.917,20v2.83a11.646,11.646,0,0,1-10.833,0Z" fill="url(#linear-gradient)"/>
  <path id="Trazado_10462" data-name="Trazado 10462" d="M174.834,119.266a4.167,4.167,0,1,0-4.167-4.167A4.171,4.171,0,0,0,174.834,119.266Zm0-7.5A3.333,3.333,0,1,1,171.5,115.1,3.337,3.337,0,0,1,174.834,111.766Z" transform="translate(-162.334 -105.516)" fill="url(#linear-gradient)"/>
</svg>

When I load the image, the result is not correct:

<Image>
    <Image.Source>
        <svg:SvgImageSource Source="icon_certificate.svg" Width="50" Height="50"/>
    </Image.Source>
</Image>

Thanks for your time!

rfernandez avatar Jan 18 '21 16:01 rfernandez