在WPF中自定义你的绘制（四）-阿里云开发者社区

在WPF中自定义你的绘制（四）

2015-11-05 1229

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： 原文:在WPF中自定义你的绘制（四）在WPF中自定义你的绘制（四）周银辉1，利用路径绘制图形（PathGeometry）有时我们需要绘制的图形可能很复杂而显得不是那么的规则，这时我们就需要将图形分解成若干小的部分（分解成线段、圆弧、贝塞尔曲线等等），然后将这些小部分使用PathGeometry组合在一起实现最终的绘制。

原文:在WPF中自定义你的绘制（四）

在WPF中自定义你的绘制（四）
周银辉

1，利用路径绘制图形（PathGeometry）
有时我们需要绘制的图形可能很复杂而显得不是那么的规则，这时我们就需要将图形分解成若干小的部分（分解成线段、圆弧、贝塞尔曲线等等），然后将这些小部分使用PathGeometry组合在一起实现最终的绘制。
一个PathGeometry对象有若干个PathFingure对象组成并保存在其Fingures属性中，一个PathFingure对象有若干个PathSegment对象组成并保存在其Segments属性中，而PathSegment则表示一些最基本的曲线和线段。继承了PathSegment的类主要有：LineSegment直线段，ArcSegment弧线段，BezierSegment贝塞尔曲线段等。反过来说，我们由一些基本的曲线和线段相互连接而组成PathFingure（可以看着一个独立的子图形），然后我们再由若干个PathFingure构成最终的复杂图形。
参考如下代码：

< Page xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml" >

< Path Stroke ="Black" StrokeThickness ="1" >

< Path .Data >

< PathGeometry >

< PathGeometry .Figures >

< PathFigureCollection >

< PathFigure StartPoint ="100,50" >

< PathFigure .Segments >

< PathSegmentCollection >

< LineSegment Point ="200,50" />

< LineSegment Point ="150,100" />

</ PathSegmentCollection >

</ PathFigure.Segments >

</ PathFigure >

</ PathFigureCollection >

</ PathGeometry.Figures >

</ PathGeometry >

</ Path.Data >

</ Path >

</ Page >

在上面的代码中，我们定义了一个图形，它由一个PathFingure组成，改PathFingure的起点是（100，50），假设我们使用一支笔来绘制该PathFingure，那么我们现在得将笔头移动到点（200，50），在起点和该点之间绘制一个LineSegment，然后将笔头移动到（150，100），在上一次绘制的终点即（200，50）和改点之间绘制一个LineSegment，便得到了下图中的图形：

之所以会产生这样的结果，请注意理解这句话“我们由一些基本的曲线和线段相互连接而组成PathFingure（可以看着一个独立的子图形）"。我们有权利选择这样的相互链接的曲线是否闭合（即将起点和终点用直线段连接起来），我们只需要将PahtFigure的IsClosed属性设置为True或False就可以了。如果我们将上面代码中的<PathFigure StartPoint="100,50" >
修改为<PathFigure StartPoint="100,50" IsClosed="True" >，那么将会得到如下图形:

就这样，我们使用多个PathFigure分别负责图形中的子图形并选择合适的颜色与填充方式，就可以绘制出最终的复杂图形，你能相信下面这么漂亮的图形就是这样绘制出来的吗？

你可以粘贴下面的代码到XamlPad到查看：

上面复杂图形的代码

你会发现上面的代码中，有许多这样的片段：
Data="F1 M 10.1172,19.4509L 1.5,21.2192L 1.5,40.5689L 10.231,42.0653L 10.1172,19.4509 Z "
这其实是描述PathGeometry所包含的数据的更轻量级的表示形式
你可以在MSDN的path markup syntax节找到解释

在WPF中自定义你的绘制（四）

热门文章

最新文章

相关电子书