当前位置：网站首页 / WPF / 正文

[ay的wpf]写给自己的wpf高级教程 [15]-弧-贝塞尔-BezierSegment[2/3]

时间：2016年07月12日 | 作者 : aaronyang | 分类 : WPF | 浏览: 2438次 | 评论 0 人

先学会Blend中怎么使用钢笔工具

这里跟PhotoShop差不多

====================www.ayjs.net 杨洋 wpfui.com ayui ay aaronyang=======请不要转载谢谢了。=========

使用笔工具

单击形成点，在已有的路径上，是添加点，在点上点击是删除点。（AY）

按住Alt键左键拖点和延长线上的点（方向线），可以重新调整弧度。

直接单击点连接就是直线

先看其他知识。Path的Data

使用PathFigureCollection的表示方法

     <Path Stroke="Black" StrokeThickness="1" Fill="#FFC8E44A">
                <Path.Data>
                    <PathGeometry Figures="M 10,100 C 10,300 300,-160 300,100" />
                </Path.Data>
            </Path>

使用StreamGeometry的表示方法

WPF提供两个类来描述路径数据：一个是StreamGeometry，另一个是PathFigureCollection

这两种方式都可以达至同一种显示效果，那么，什么时候使用StreamGeometry，什么时候使用PathFigureCollection方式呢？

一般地，当你建立路径后，不再需要修改时，可使用StreamGeometry方式，如果还需要对路径数值进行修改，则使用PathFigureCollection方式（这里就是PathGeometry）

参考文章地址：http://blog.csdn.net/johnsuna/article/details/1885597

Data属性的表示语法：

(1)StreamGeometry方式： [填充规则] 外形描述[外形描述]*

(2)PathFigureCollection方式：外形描述[外形描述]*

注：

(1)上面语法中，[...]表示可选，*代表任意个。

(2)“填充规则”中，有EvenOdd和Nonzero两种。XAML中为了简洁，使用“F0”表示EvenOdd，“F1”表示Nonzero。

(3)“外形描述”的语法：moveCommand drawCommands [closeCommand]

其中：移动指令（moveCommand），绘制指令（drawCommands），关闭指令（closeCommand）。

(4)moveCommand指定起始点，使用一个drawingCommand描述外形轮廓的内容描述，closeCommand用来关闭路径。

1. 移动指令：Move Command（M）：M 起始点或者：m 起始点

比如：M 100,240或m 100,240

使用大写M时，表示绝对值; 使用小写m时; 表示相对于前一点的值，如果前一点没有指定，则使用(0,0)。

2. 绘制指令(Draw Command):

我们可以绘制以下形状：

(1) 直线:Line(L)

(2) 水平直线: Horizontal line(H)

(3) 垂直直线: Vertical line(V)

(4) 三次方程式贝塞尔曲线: Cubic Bezier curve(C)

(5) 二次方程式贝塞尔曲线: Quadratic Bezier curve(Q)

(6) 平滑三次方程式贝塞尔曲线: Smooth cubic Bezier curve(S)

(7) 平滑二次方程式贝塞尔曲线: smooth quadratic Bezier curve(T)

(8) 椭圆圆弧: elliptical Arc(A)

上面每种形状后用括号括起的英文字母为命令简写的大写形式，但你也可以使用小写。使用大写与小写的区别是：大写是绝对值，小写是相对值。

比如：L 100, 200 L 300,400表示从绝对坐标点(100,200)到另一绝对坐标点(300,400)的一条直线。而l 100, 200 l 300,400则表示相对上一点（如果未指定，则默认为(0,0)坐标点）开始计算的坐标点(100,200)到坐标点为(300,400)的一条直线。

当我们重复使用同一种类型时，就可以省略前面的命令。比如：L 100, 200 L 300,400简写为：L 100, 200 300,400。

细心的读者可能会发现，有点怪怪的感觉，因为我故意将下面的三角形的代码放在前面了，这样，似乎不太符合习惯。事实上，上面的代码与这个结果完全一样：

这里有一个你暂时还没见过的Z指令，它就是一个关闭指令（close Command），表示封闭指定形状，即将首尾点连接起来形成封闭的区域

绘制指令格式语法:

(1) 直线:Line(L)
格式：L 结束点坐标或: l 结束点坐标。
比如：L 100,100 或 l 100 100。坐标值可以使用x,y（中间用英文逗号隔开）或x y（中间用半角空格隔开）的形式。

(2) 水平直线 Horizontal line(H)：绘制从当前点到指定x坐标的直线。
格式：H x值或 h x值(x为System.Double类型的值)
比如：H 100或h 100，也可以是：H 100.00或h 100.00等形式。

(3) 垂直直线 Vertical line(V)：绘制从当前点到指定y坐标的直线。
格式：V y值或 v y值(y为System.Double类型的值)
比如：V 100或y 100，也可以是：V 100.00或v 100.00等形式。

(4) 三次方程式贝塞尔曲线 Cubic Bezier curve(C)：通过指定两个控制点来绘制由当前点到指定结束点间的三次方程贝塞尔曲线。
格式：C 第一控制点第二控制点结束点或 c 第一控制点第二控制点结束点
比如：C 100,200 200,400 300,200 或 c 100,200 200,400 300,200
其中，点(100,200)为第一控制点，点(200,400)为第二控制点，点(300,200)为结束点。

(5) 二次方程式贝塞尔曲线 Quadratic Bezier curve(Q)：通过指定的一个控制点来绘制由当前点到指定结束点间的二次方程贝塞尔曲线。
格式：Q 控制点结束点或 q 控制点结束点
比如：q 100,200 300,200。其中，点(100,200)为控制点，点(300,200)为结束点。

(6) 平滑三次方程式贝塞尔曲线: Smooth cubic Bezier curve(S)：通过一个指定点来“平滑地”控制当前点到指定点的贝塞尔曲线。
格式：S 控制点结束点或 s 控制点结束点
比如：S 100,200 200,300

(7) 平滑二次方程式贝塞尔曲线 smooth quadratic Bezier curve(T)：与平滑三次方程贝塞尔曲线类似。
格式：T 控制点结束点或 t 控制点结束点
比如：T 100,200 200,300

关于第(6)种平滑三次方程式贝塞尔曲线与第(7)种平滑二次方程式贝塞尔曲线的比较：