Wpf InkCanvas将笔画保存为svg

Question

是否可以将InkCanvas笔画集保存为SVG图像？我只能找到一个方法，即将笔画保存为带有嵌入式ISF（Ink Serialized Format）的GIF或者可能将其呈现为位图。我想要将笔画保存为可与其他平台（如Web）互操作的矢量格式。

- Mayank

---

不确定这个问题为什么太宽泛？我正在问一个非常具体的问题；无意冒犯，但投票关闭它因为它过于宽泛的人应该重新阅读问题。 - Mayank

也许可以添加如何将它们保存为GIF。然后询问SVG文件可能不会太广泛。 - rene

Answer 1

我已经弄清楚了。

以下是步骤：

1. 遍历 StrokeCollection。
2. 通过调用 GetGeometry 函数然后调用 GetOutlinedPathGeometry，获取每个 Stroke 的 PathGeometry。
3. 从 Geometry 中获取 Figures。我通过将 PathGeometry 保存到 XAML 中，然后通过 XElement.Parse 解析 Figures 属性来完成。
4. 然后我可以创建一个 svg 文档并添加每个路径（请参见下面的代码）。

我正在使用 SVG 渲染库 创建 SVG 文档。

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
               });
           }
       }
}

- Mayank

---

非常有用！我建议将foreach循环中的第一行更改为以下内容：var geometry = stroke.GetGeometry(stroke.DrawingAttributes).GetOutlinedPathGeometry();这将确保如果使用不同的工具/属性创建笔画，它们将被保留。例如，如果有人使用方形尖头而不是圆形尖头。编辑：编辑答案以反映此更改。 - Dax Pandhi

@DaxPandhi，你试过这些修改了吗？只是确认它能够与你的修改一起工作。如果可以，请确认一下，我会批准这些修改。谢谢。 - Mayank

是的，我已经成功地在我的应用程序中使用了修改后的代码，并且它运行良好。我首先尝试了您粘贴的原始代码，虽然它可以工作，但我的不同的nib形状没有被保存。经过修改后，我能够保留这些形状。 - Dax Pandhi