UIBezier简介

基本介绍

使用UIBezierPath可以创建基于矢量的路径,此类是Core Graphics框架关于路径的封装。使用此类可以定义简单的形状,如椭圆、矩形或者有多个直线和曲线段组成的形状等。

UIBezierPath是CGPathRef数据类型的封装。如果是基于矢量形状的路径,都用直线和曲线去创建。我们使用直线段去创建矩形和多边形,使用曲线去创建圆弧(arc)、圆或者其他复杂的曲线形状。

使用方法

1.创建一个UIBezierPath对象

2.调用-moveToPoint:设置初始线段的起点

3.添加线或者曲线去定义一个或者多个子路径

4.改变UIBezierPath对象跟绘图相关的属性。如,我们可以设置画笔的属性、填充样式等

具体实战

1.画直线

- (void)drawRect:(CGRect)rect{

//创建path

UIBezierPath *path = [UIBezierPath bezierPath];

//添加路径到path

[path moveToPoint:CGPointMake(100, 100)];

[path addLineToPoint:CGPointMake(200, 100)];

//将path绘制出来

[path stroke];

}

2.画三角形

UIBezierPath *path = [UIBezierPath bezierPath];

[path moveToPoint:CGPointMake(0, 0)];

[path addLineToPoint:CGPointMake(0, self.frame.size.height)];

[path addLineToPoint:CGPointMake(self.frame.size.width, self.frame.size.height / 2)];

[path closePath];

//设置线宽

[path setLineWidth:1.5];

//设置填充色

[[UIColor purpleColor] setFill];

//设置画壁颜色

[[UIColor greenColor] setStroke];

//填充

[path fill];

//划线

[path stroke];


3.画矩形

   UIBezierPath * path = [UIBezierPath bezierPathWithRect:CGRectMake(20, 100, self.frame.size.width - 40, self.frame.size.width - 40)];

   [path setLineWidth:20];

  [path setLineCapStyle:kCGLineCapRound];

/**

*设置线条拐角帽的样式的

*typedef CF_ENUM(int32_t, CGLineCap) {

*kCGLineCapButt,//默认

*kCGLineCapRound,//圆角

*kCGLineCapSquare//正方形

*};

*/

//[path setLineJoinStyle:kCGLineJoinRound];

/**

*设置两条线连结点的样式

*typedef CF_ENUM(int32_t, CGLineJoin) {

*kCGLineJoinMiter,//默认,斜接

*kCGLineJoinRound,//圆滑衔接

*kCGLineJoinBevel//斜角衔接

*/

//设置填充色

   [[UIColor purpleColor] setFill];

  [path fill];

   [[UIColor blueColor] setStroke];

   [path stroke];

效果图


UIBezier简介_第1张图片

4.画圆(当传入的宽、高参数相等则为圆,否则为椭圆)

   UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(20, 100, self.frame.size.width - 40, self.frame.size.width - 40)];

 [path setLineWidth:5];

   [[UIColor redColor] setFill];

  [path fill];

  [[UIColor greenColor] setStroke];

    [path stroke];

效果图

UIBezier简介_第2张图片

5.圆角矩形

UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(20, 100, self.frame.size.width - 40, self.frame.size.width) cornerRadius:20];

//+ (instancetype)bezierPathWithRoundedRect:(CGRect)rect byRoundingCorners:(UIRectCorner)corners cornerRadii:(CGSize)cornerRadii;//该方法设置某一角为圆角

[[UIColor redColor] setFill];

[path fill];

[[UIColor greenColor] setStroke];

[path stroke];

效果图

UIBezier简介_第3张图片

6.弧线

#define K_PI 3.1415926

#define KDEGREESTORADIANS(degrees) ((K_PI * degrees) / 180)

UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:self.center radius:100 startAngle:0 endAngle:KDEGREESTORADIANS(275) clockwise:YES];

[path setLineWidth:10];

[path setLineCapStyle:kCGLineCapRound];

[path setLineJoinStyle:kCGLineJoinRound];

[[UIColor grayColor] setStroke];

[path stroke];

效果图

UIBezier简介_第4张图片

7.二次贝塞尔曲线

UIBezierPath *path = [UIBezierPath bezierPath];

//起始点

[path moveToPoint:CGPointMake(20, self.frame.size.height - 100)];

//添加二次曲线

[path addQuadCurveToPoint:CGPointMake(self.frame.size.width - 20, self.frame.size.height - 100) controlPoint:CGPointMake(self.frame.size.width / 2, 0)];

[path setLineWidth:10.0];

[[UIColor blueColor] setStroke];

[path stroke];

效果图

UIBezier简介_第5张图片

8.三次贝塞尔曲线

UIBezierPath *path = [UIBezierPath bezierPath];

//设置起点

[path moveToPoint:CGPointMake(20, 150)];

[path addCurveToPoint:CGPointMake(300, 150) controlPoint1:CGPointMake(160, 0) controlPoint2:CGPointMake(160, 250)];

[path setLineWidth:10.0];

[[UIColor greenColor] setStroke];

[path stroke];

效果图

UIBezier简介_第6张图片

9.点击事件


@interface RectView ()

@property (nonatomic,strong)UIBezierPath *path;

@end

//初始化

UIBezierPath *path = [UIBezierPath bezierPath];

//设置起始位置

[path moveToPoint:CGPointMake(10, 10)];

[path addLineToPoint:CGPointMake(20, 60)];

[path addLineToPoint:CGPointMake(40, 80)];

[path setLineWidth:5];

//设置线帽

//    [path setLineCapStyle:kCGLineCapRound];

//拐角样式

[path setLineJoinStyle:kCGLineJoinRound];

//闭合

[path closePath];

//设置线的颜色

[[UIColor redColor] setStroke];

//'设置填充的颜色

[[UIColor greenColor] setFill];

//划线

[path stroke];

//填充

[path fill];

self.path = path;

- (void)touchesEnded:(NSSet*)touches withEvent:(UIEvent *)event{

//获取到点击的点

UITouch *touch = touches.anyObject;

//该店在view上的坐标

CGPoint point = [touch locationInView:self];

if ([self.path containsPoint:point]) {

NSLog(@"该店在三角形内");

}

10.滑动事件

@implementation RectView{

CGPoint _point;

}

UIBezierPath *path = [UIBezierPath bezierPath];

[path addArcWithCenter:_point radius:10 startAngle:0 endAngle:2 * M_PI clockwise:YES];

[[UIColor redColor] setFill];

[[UIColor blueColor] setStroke];

[path stroke];

[path fill];

- (void)touchesMoved:(NSSet*)touches withEvent:(UIEvent *)event{

UITouch *touch = touches.anyObject;

CGPoint point = [touch locationInView:self];

_point = point;

[self setNeedsDisplay];

}

效果图

UIBezier简介_第7张图片

你可能感兴趣的:(UIBezier简介)