Skip to content
Custom ImageSource that will become able to show svg image for Xamarin.Forms
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
Sample First commit Aug 25, 2017
SvgImageSource.Droid First commit Aug 25, 2017
SvgImageSource.iOS First commit Aug 25, 2017
SvgImageSource First commit Aug 25, 2017
nuget ReadMe Aug 25, 2017
.gitignore First commit Aug 25, 2017
LICENSE.txt First commit Aug 25, 2017
README.md ReadMe Aug 25, 2017
SvgImageSource.sln First commit Aug 25, 2017

README.md

SvgImageSource for Xamarin.Forms

This is a package to add SvgImageSource to Xamarin.Forms as new ImageSource. Thereby Xamarin.Forms.Image will become able to display a SVG image without particular modified.

Now version is pre release.
Using this library have to install more than or equal Xamarin.Forms 2.4.0.266 -pre1.

Nuget Installation

https://www.nuget.org/packages/Xamarin.Forms.Svg/

Install-Package Xamain.Forms.Svg -pre

You need to install this nuget package to PCL project and each platform project.

Preparing to use

iOS AppDelegate.cs.

public override bool FinishedLaunching(UIApplication app, NSDictionary options) 
{    
	global::Xamarin.Forms.Forms.Init();

    Xamarin.Forms.Svg.iOS.SvgImage.Init();  //need to write here

    LoadApplication(new App(new iOSInitializer()));

    return base.FinishedLaunching(app, options);
}

Android MainActivity.cs

protected override void OnCreate(Bundle bundle)
{
    ...
    global::Xamarin.Forms.Forms.Init(this, bundle);

    Xamarin.Forms.Svg.Droid.SvgImage.Init(); //need to write here

    LoadApplication(new App(new AndroidInitializer()));
}

PCL

In case specifying svg's resource with only Xaml, following code has to be written in App.xaml.cs.

public App()
{
	InitializeComponent();

	SvgImageSource.RegisterAssembly();
	//SvgImageSource.RegisterAssembly(typeof(typehavingresource)); in case other assembly
}

How to use

public ImageSource Image { get; set; } 

public SomeViewModel(){
	//specify resource's path 
	Image = SvgImageSource.FromSvg("Resource.some.svg");
	//specify color
	Image = SvgImageSource.FromSvg("Resource.some.svg", Color.Red);
	//specify width height
	Image = SvgImageSource.FromSvg("Resourece.some.svg", 150, 50)
}
<Image Source="{Binding Image}" />

Resource path is found by backward match.

only Xaml

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
	xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
	xmlns:svg="clr-namespace:Xamarin.Forms.Svg;assembly=SvgImageSource"
	x:Class="Sample.Views.MainPage" Title="MainPage">
	<StackLayout>
        <Image>
            <Image.Source>
                <svg:SvgImageSource Resource="some.svg" Width=150 Height=50 Color="Red" />
            </Image.Source>
        </Image>
	</StackLayout> 
</ContentPage>

License

MIT Licensed.

You can’t perform that action at this time.