0

I've successfully been able to use a static .svg file as an image in WPF by following the guidance in another question.

The basic approach there is to use the SharpVectors library, and do:

<svgc:SvgViewbox Source="path/to/file.svg"/>

In place of an <Image .../> tag.

However I am struggling trying to find a similar method to use an SVG within a System.Windows.Controls.Ribbon - where i'd like to use it as the SmallImageSource of a RibbonMenuButton.

I have tried the following:

<RibbonMenuButton Label="Test">
    <RibbonMenuButton.SmallImageSource>
        <svgc:SvgViewbox Source="path/to/file.svg"/>
    </RibbonMenuButton.SmallImageSource>
</RibbonMenuButton>

Which produces the compiler error message:

The specified value cannot be assigned. The following type was expected: "ImageSource".

I think the key problem is that an svgc:SvgViewBox is not an "image source", but I don't know how to properly convert or otherwise work around this.

I'm open to alternate approaches which don't use SharpVectors, but it is extremely convenient to have source image files in SVG format and not have to manually convert to any other format.

PaulusHub
  • 385
  • 1
  • 4
  • 17
StayOnTarget
  • 11,743
  • 10
  • 52
  • 81
  • The `SmallImageSource` property can only be set to an `ImageSource` and nothing else. There is no other workaround than to convert the .svg file to an image. Please refer to [this](https://stackoverflow.com/a/3528493/7252182) answers for some pointers to how to do this. – mm8 Apr 23 '19 at 11:52
  • @mm8 thanks, that was the same question I linked to in this question. I'm not experienced enough in WPF to know but I was hoping there would be some type of converter class that could be used. – StayOnTarget Apr 23 '19 at 12:05

2 Answers2

0

SharpVectors includes a converter extension which can be used to 'output' an ImageSource.

This is documented in section "1.2 WPF Extensions and Type Converters" of their usage guidelines.

Example:

<RibbonMenuButton Label="Test" LargeImageSource="{svgc:SvgImage path/to/file.svg}"/>

(where svgc is the defined name of the SharpVectors namespace in your XAML.)

The svgc:SvgImage binding extension produces a DrawingImage which is a type of ImageSource. This works perfectly at runtime with the SVG image rendered into the button.

Unfortunately at design-time the button image is blank.

StayOnTarget
  • 11,743
  • 10
  • 52
  • 81
0

Please try using the newly added property; AppName, which is used to try and resolve the URI of the resource file at design-time. See the samples for the SvgImage and newly added SvgImageConverter, especially the toolbar demo using the SVG icons.

https://github.com/ElinamLLC/SharpVectors/tree/master/TutorialSamples/ControlSamplesWpf

SvgImageConverter provides binding support, if you need it unlike the SvgImage.

PaulusHub
  • 385
  • 1
  • 4
  • 17