C#--SVG矢量图画法示例

@Crazy Snail2024-05-23 20:57

1.代码示例

cs 复制代码

<Viewbox   Grid.Column="1" Grid.ColumnSpan="1" Grid.RowSpan="1" >
   <Path Name="ValveShape" Stroke="Black"   Data="M 50,0 L 150,200 L 50,200 L 150,0 Z" Width="200" Height="200" StrokeThickness="1"
                        Fill="SteelBlue"  />
</Viewbox >

2.释义

Data="M 50,0 L 150,200 L 50,200 L 150,0 Z": 定义了路径的数据，描述了构成阀门形状的各个点和线段。这里是用SVG路径数据格式编写的，从(50,0)点开始，到(150,200)，再到(50,200)，然后到(150,0)，最后闭合(Z)形成一个四边形。

3.成图效果

补充：

在XAML路径数据上下文中，M 和 L 是用于定义路径命令的字符，它们属于SVG路径数据语法的一部分，广泛应用于矢量图形描述，包括在XAML中定义形状。这些命令指示如何从一个点移动到另一个点以及如何绘制直线。具体来说：

M 或 m 表示 Move To 命令。它用于将绘图的当前位置移动到指定的坐标，不绘制任何东西 。大写字母 M 表示绝对坐标 ，小写字母 m 表示相对于当前位置的相对坐标。
L 或 l 表示 Line To 命令。用于从当前点画一条直线到指定的坐标 。同样地，大写字母 L 使用绝对坐标，小写字母 l 使用相对坐标。

例如，在路径数据 "M 50,0 L 150,200" 中，M 50,0 首先将绘图笔移动到坐标 (50, 0)，然后 L 150,200 从上一个点画一条直线到坐标 (150, 200)。

此外Z或 z 命令代表 ClosePath，用于关闭一个子路径，即从当前点绘制一条直线回到子路径的起始点。这在绘制封闭图形时非常有用，如圆形、矩形等。