ぴーさんログ

だいたいXamarin.Formsのブログ

「NGraphics」がSVGを読み込めるようになりました

以前このブログで紹介した「NGraphics」がバージョンアップしてSVGを扱えるようになってました。

Xamarinでも使えるクロスプラットフォームなベクタグラフィクスライブラリ 「NGrapchics」 - ぴーさんログ

という訳で早速使い方を確認してみましょう。表示するのはSVGサンプルとして定番らしいこのトラの画像です。

f:id:ticktack623:20160102211918j:plain

SVGの読み込みは NGraphics.Graphic.LoadSvg(TextReader reader) で行います。 ファイルから読む場合はStreamReader、リテラルから読む場合はStringReaderを使うと良いでしょう。

サンプルは以前の記事に合わせてXamarin.iOSです。graphic.Draw()までの流れは他プラットフォームでも同様ですね。

using System;
using UIKit;
using NGraphics;
using System.IO;

namespace NGraphicsSvgSample
{
    public partial class ViewController : UIViewController
    {
        // (省略)
        public override void ViewDidLoad()
        {
            base.ViewDidLoad();

            // graphic.Drawm() までは他のプラットフォームでも同様
            IImageCanvas canvas = null;
            using(var reader = new StringReader(svgTiger))
            {
                var graphic = Graphic.LoadSvg(reader);
                canvas = Platforms.Current.CreateImageCanvas(graphic.Size);
                graphic.Draw(canvas);
            }

            imageView.Image = canvas?.GetImage()?.GetUIImage();
            textView.Text = svgTiger;
        }
        // (省略)
        
        // tiger.svg の中身
        private readonly string svgTiger = @"<svg xmlns:rdf=""http://www.w3.org/1999/02/22-rdf-syntax-ns#"" xmlns=""http://www.w3.org/2000/svg"" height=""900"" width=""900"" version=""1.1"" xmlns:cc=""http://creativecommons.org/ns#"" xmlns:dc=""http://purl.org/dc/elements/1.1/"">
      ...
</svg>";
    }
}

結果はこんな感じ、バッチリSVGデータを描画できました。

f:id:ticktack623:20160102211943p:plain