Wpf InkCanvas save stokes as svg

China☆狼群 提交于 2019-11-28 06:02:50

问题


Is it possible to save InkCanvas stroke collection to svg image? Only thing I can find is that I can save the strokes as GIF with embedded ISF (Ink Serialized Format) or maybe render them as bitmap. I want to save strokes in vector format that can be interoperable with other platforms (like web).


回答1:


I figured it out.

Here are the steps

  1. Iterate over the StrokeCollection
  2. Get PathGeometry of each Stroke by calling GetGeometry function and then calling GetOutlinedPathGeometry.
  3. Get Figures out of Geometry. I am doing it by saving the PathGeometry to XAML and then parsing the Figures attribute by XElement.Parse.
  4. Then I can just create a svg document and add each path (see code below).

I am using SVG Rendering Library to create SVG document.

var svg = new SvgDocument();
var colorServer = new SvgColourServer(System.Drawing.Color.Black);

var group = new SvgGroup {Fill = colorServer, Stroke = colorServer};
svg.Children.Add(group);

  foreach (var stroke in InkCanvas.Strokes)
  {
      var geometry = stroke.GetGeometry(stroke.DrawingAttributes).GetOutlinedPath‌​Geometry();

      var s = XamlWriter.Save(geometry);

      if (s.IsNotNullOrEmpty())
      {
          var element = XElement.Parse(s);

          var data = element.Attribute("Figures")?.Value;

          if (data.IsNotNullOrEmpty())
          {
              group.Children.Add(new SvgPath
              {
                  PathData = SvgPathBuilder.Parse(data),
                  Fill = colorServer,
                  Stroke = colorServer
               });
           }
       }
}


来源:https://stackoverflow.com/questions/39261548/wpf-inkcanvas-save-stokes-as-svg

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!