CODEWITHSUNDEEP
c#wpfxamlsvgsharpvectors
StayOnTarget
StayOnTarget

Reputation: 13037

Using an SVG as a Ribbon SmallImageSource, with SharpVectors?

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.

Upvotes: 1

Views: 3500

Answers (2)

PaulusHub
PaulusHub

Reputation: 405

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.

Upvotes: 0

StayOnTarget
StayOnTarget

Reputation: 13037

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.

Upvotes: 0

Related Questions