在WPF中使用SVG矢量图

WPF原生并不支持svg矢量图。但是WPF原生的画形状工具的使用方式与SVG非常相似。

以该图片为例：

这个图片的形状是这样的：

在这段svg代码里面，主体的就是那一段特别长的path标签，它包含的4段“M”开头的数据分别定义了这四个方块。

而在WPF中，有着用法完全相同的path标签。所以用法也很简单，只要在WPF中创建一段 标签，并将这段数据作为“data”的参数填入，就像这样：

但是，这种方法有一个问题：

这段svg代码的对应图形如下：

可以很明显的发现，这段代码和上一个相比，增加了Line、rect两类元素，分别对应的是分隔的横线和内部的两点两横。他们的数据方式也与path截然不同，难以直接转化。

不过，所幸市面上有很多成熟的矢量图转化（和编辑）软件。例如开源的inkscape。用inkscape打开该svg文件，然后保存为xaml格式，我们就得到了以下代码：

毫无疑问，xaml文件作为WPF本身的主体文件当然是完美符合语法的。

接下来，只要在WPF中创建一个用户控件，然后用这里的整块代替原本的，就获得了一个矢量的用户控件，可以被别的模块调用。

——但是注意，似乎是因为svg和xaml的格式不同，第一是xaml里面对小数点后的数据支持很差，虽然支持小数点后一位，但是实际调整时很可能根本没有变化，或者变化方式不仅离散而且变化临界点很奇怪。 但是在设计器里没法正确显示这个规模的变化（实际运行后是正常修改了的）。

第二是个别元素的位置会发生奇怪的偏移（可能是因为小数点）。

因此，需要看着设计界面对元素稍作修正。当然如果从一开始制作的svg就不包含小数点就再好不过了。