第一章 UIBezierPath简介
使用UIBezierPath类可以创建基于矢量的路径,这个类在UIKit中。此类是Core Graphics框架关于path的一个封装。使用此类可以定义简单的形状,如椭圆或者矩形,或者有多个直线和曲线段组成的形状。
UIBezierPath对象是CGPathRef数据类型的封装。path如果是基于矢量形状的,都用直线和曲线段去创建。我们使用直线段去创建矩形和多边形,使用曲线段去创建弧(arc),圆或者其他复杂的曲线形状。每一段都包括一个或者多个点,绘图命令定义如何去诠释这些点。每一个直线段或者曲线段的结束的地方是下一个的开始的地方。每一个连接的直线或者曲线段的集合成为subpath。一个UIBezierPath对象定义一个完整的路径包括一个或者多个subpaths、
创建和使用一个path对象的过程是分开的。创建path是第一步,包含一下步骤:
(1)创建一个Bezier path对象。
//创建一个简单的对象
+ ( UIBezierPath *)bezierPath;
//创建一个fram大小对象
+ ( UIBezierPath *)bezierPathWithRect:( CGRect )rect;
// 创建一个椭圆的fram大小的对象 + ( UIBezierPath *)bezierPathWithOvalInRect:( CGRect )rect;
//创建一个制定半径的圆形对象 + ( UIBezierPath *)bezierPathWithRoundedRect:( CGRect )rect cornerRadius:( CGFloat )cornerRadius; // rounds all corners with the same horizontal and vertical radius
//创建一个偏向性的对象 + ( UIBezierPath *)bezierPathWithRoundedRect:( CGRect )rect byRoundingCorners:( UIRectCorner )corners cornerRadii:( CGSize )cornerRadii;
//创建一个制定半径,中心点,以及弧度偏向的对象 + ( UIBezierPath *)bezierPathWithArcCenter:( CGPoint )center radius:( CGFloat )radius startAngle:( CGFloat )startAngle endAngle:( CGFloat )endAngle clockwise:( BOOL )clockwise;
// + ( UIBezierPath *)bezierPathWithCGPath:( CGPathRef )CGPath;
(2)使用方法moveToPoint:去设置初始线段的起点。
- ( void )moveToPoint:( CGPoint )point;
(3)添加line或者curve去定义一个或者多个subpaths。
//添加一条到point的直线
- ( void )addLineToPoint:( CGPoint )point;
//添加一条到endPoint的线,并包含两个转折点
- ( void )addCurveToPoint:( CGPoint )endPoint controlPoint1:( CGPoint )controlPoint1 controlPoint2:( CGPoint )controlPoint2;
//添加一条过cotrolPoint点的到endPoint的曲线 - ( void )addQuadCurveToPoint:( CGPoint )endPoint controlPoint:( CGPoint )controlPoint;
//添加一个圆 - ( void )addArcWithCenter:( CGPoint )center radius:( CGFloat )radius startAngle:( CGFloat )startAngle endAngle:( CGFloat )endAngle clockwise:( BOOL )clockwise NS_AVAILABLE_IOS( 4 _0);
// 说明:closePath方法不仅结束一个shape的subpath表述,它也在最后一个点和第一个点之间画一条线段,如果我们画多边形的话,这个一个便利的方法我们不需要去画最后一条线。 - ( void )closePath;
[aPath stroke];//Draws line 根据坐标点连线
(4)改变UIBezierPath对象跟绘图相关的属性。
@property ( nonatomic ) CGFloat lineWidth; @property ( nonatomic ) CGLineCap lineCapStyle; @property ( nonatomic ) CGLineJoin lineJoinStyle; @property ( nonatomic ) CGFloat miterLimit; // Used when lineJoinStyle is kCGLineJoinMiter @property ( nonatomic ) CGFloat flatness;
@property ( nonatomic ) BOOL usesEvenOddFillRule;
例如,我们可以设置stroked path的属性lineWidth和lineJoinStyle。也可以设置filled path的属性usesEvenOddFillRule。
当创建path,我们应该管理path上面的点相对于原点(0,0),这样我们在随后就可以很容易的移动path了。为了绘制path对象,我们要用到stroke和fill方法。这些方法在current graphic context下渲染path的line和curve段。
(5) UIBezierPath画圆
- ( void )addArcWithCenter:( CGPoint )center radius:( CGFloat )radius startAngle:( CGFloat )startAngle endAngle:( CGFloat )endAngle clockwise:( BOOL )clockwise NS_AVAILABLE_IOS( 4 _0);这个方法
其中的参数分别指定:这段圆弧的中心,半径,开始角度,结束角度,是否顺时针方向。
在IOS中角度的定义如上图
第二章 CAShapeLayer
CAShapeLayer 是继承与clayer的一个类,是quare2d中对图层操作最基本的一个类的扩展,通过CAShapeLayer 我们可以画出我们需要的各种图形,当和 UIBezierPath结合时,各种绘画操作更是不再话下。下面是一些设置
fillColor //填充颜色
fillRule // 可能的值是“形状填充模式所示的值。“默认是kCAFillRuleNonZero。在可可看到“绕组规则”绘画指导两 个填充规则的例子。
lineCap // lineCap 指定端点的形状的抚摸时开放的路径的风格。
lineDashPattern //
lineDashPhase property
lineJoin property
lineWidth property
miterLimit property
strokeColor property
strokeStart property
strokeEnd property
https://developer.apple.com/library/ios/documentation/GraphicsImaging/Reference/CAShapeLayer_class/Reference/Reference.html
官方文档
使用UIBezierPath类可以创建基于矢量的路径,这个类在UIKit中。此类是Core Graphics框架关于path的一个封装。使用此类可以定义简单的形状,如椭圆或者矩形,或者有多个直线和曲线段组成的形状。
UIBezierPath对象是CGPathRef数据类型的封装。path如果是基于矢量形状的,都用直线和曲线段去创建。我们使用直线段去创建矩形和多边形,使用曲线段去创建弧(arc),圆或者其他复杂的曲线形状。每一段都包括一个或者多个点,绘图命令定义如何去诠释这些点。每一个直线段或者曲线段的结束的地方是下一个的开始的地方。每一个连接的直线或者曲线段的集合成为subpath。一个UIBezierPath对象定义一个完整的路径包括一个或者多个subpaths、
创建和使用一个path对象的过程是分开的。创建path是第一步,包含一下步骤:
(1)创建一个Bezier path对象。
//创建一个简单的对象
+ ( UIBezierPath *)bezierPath;
//创建一个fram大小对象
+ ( UIBezierPath *)bezierPathWithRect:( CGRect )rect;
// 创建一个椭圆的fram大小的对象 + ( UIBezierPath *)bezierPathWithOvalInRect:( CGRect )rect;
//创建一个制定半径的圆形对象 + ( UIBezierPath *)bezierPathWithRoundedRect:( CGRect )rect cornerRadius:( CGFloat )cornerRadius; // rounds all corners with the same horizontal and vertical radius
//创建一个偏向性的对象 + ( UIBezierPath *)bezierPathWithRoundedRect:( CGRect )rect byRoundingCorners:( UIRectCorner )corners cornerRadii:( CGSize )cornerRadii;
//创建一个制定半径,中心点,以及弧度偏向的对象 + ( UIBezierPath *)bezierPathWithArcCenter:( CGPoint )center radius:( CGFloat )radius startAngle:( CGFloat )startAngle endAngle:( CGFloat )endAngle clockwise:( BOOL )clockwise;
// + ( UIBezierPath *)bezierPathWithCGPath:( CGPathRef )CGPath;
(2)使用方法moveToPoint:去设置初始线段的起点。
- ( void )moveToPoint:( CGPoint )point;
(3)添加line或者curve去定义一个或者多个subpaths。
//添加一条到point的直线
- ( void )addLineToPoint:( CGPoint )point;
//添加一条到endPoint的线,并包含两个转折点
- ( void )addCurveToPoint:( CGPoint )endPoint controlPoint1:( CGPoint )controlPoint1 controlPoint2:( CGPoint )controlPoint2;
//添加一条过cotrolPoint点的到endPoint的曲线 - ( void )addQuadCurveToPoint:( CGPoint )endPoint controlPoint:( CGPoint )controlPoint;
//添加一个圆 - ( void )addArcWithCenter:( CGPoint )center radius:( CGFloat )radius startAngle:( CGFloat )startAngle endAngle:( CGFloat )endAngle clockwise:( BOOL )clockwise NS_AVAILABLE_IOS( 4 _0);
// 说明:closePath方法不仅结束一个shape的subpath表述,它也在最后一个点和第一个点之间画一条线段,如果我们画多边形的话,这个一个便利的方法我们不需要去画最后一条线。 - ( void )closePath;
[aPath stroke];//Draws line 根据坐标点连线
(4)改变UIBezierPath对象跟绘图相关的属性。
@property ( nonatomic ) CGFloat lineWidth; @property ( nonatomic ) CGLineCap lineCapStyle; @property ( nonatomic ) CGLineJoin lineJoinStyle; @property ( nonatomic ) CGFloat miterLimit; // Used when lineJoinStyle is kCGLineJoinMiter @property ( nonatomic ) CGFloat flatness;
@property ( nonatomic ) BOOL usesEvenOddFillRule;
例如,我们可以设置stroked path的属性lineWidth和lineJoinStyle。也可以设置filled path的属性usesEvenOddFillRule。
当创建path,我们应该管理path上面的点相对于原点(0,0),这样我们在随后就可以很容易的移动path了。为了绘制path对象,我们要用到stroke和fill方法。这些方法在current graphic context下渲染path的line和curve段。
(5) UIBezierPath画圆
- ( void )addArcWithCenter:( CGPoint )center radius:( CGFloat )radius startAngle:( CGFloat )startAngle endAngle:( CGFloat )endAngle clockwise:( BOOL )clockwise NS_AVAILABLE_IOS( 4 _0);这个方法
其中的参数分别指定:这段圆弧的中心,半径,开始角度,结束角度,是否顺时针方向。
在IOS中角度的定义如上图
第二章 CAShapeLayer
CAShapeLayer 是继承与clayer的一个类,是quare2d中对图层操作最基本的一个类的扩展,通过CAShapeLayer 我们可以画出我们需要的各种图形,当和 UIBezierPath结合时,各种绘画操作更是不再话下。下面是一些设置
fillColor //填充颜色
fillRule // 可能的值是“形状填充模式所示的值。“默认是kCAFillRuleNonZero。在可可看到“绕组规则”绘画指导两 个填充规则的例子。
lineCap // lineCap 指定端点的形状的抚摸时开放的路径的风格。
lineDashPattern //
lineDashPhase property
lineJoin property
lineWidth property
miterLimit property
strokeColor property
strokeStart property
strokeEnd property
https://developer.apple.com/library/ios/documentation/GraphicsImaging/Reference/CAShapeLayer_class/Reference/Reference.html
官方文档