快速上手IOS UIBezierPath(贝塞尔曲线)

 更新时间:2017年03月17日 16:45:47   作者:洛洛爱吃肉  
本文主要介绍了IOS 贝塞尔曲线(UIBezierPath)的基础知识。具有很好的参考价值。下面跟着小编一起来看下吧

UIBezierPath主要用来绘制矢量图形,它是基于Core Graphics对CGPathRef数据类型和path绘图属性的一个封装,所以是需要图形上下文的(CGContextRef),所以一般UIBezierPath在drawRect中使用。

使用方法

UIBezierPath 是对 CGPathRef 的封装。创建矢量图形时,拆解成一或多条线段,拼接起来,每条线段的终点都是下一条线段的起点。

具体地:

1.创建一个 UIBezierPath 对象

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

3.添加线段,定义一或多个子路径

4.修改 UIBezierPath 的绘图相关的属性,比如stroke path的属性 lineWidth 和 lineJoinStyle ,filled path的属性 usesEvenOddFillRule

注意:如果是矩形或者圆之类的特殊图形,可以不用第2步。

代码案例

画直线

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(50, 50)];
[path addLineToPoint:CGPointMake(100, 50)];
path.lineWidth = 5.0f;
path.lineJoinStyle = kCGLineJoinRound;
[path stroke];

创建三角形

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(50, 50)];
[path addLineToPoint:CGPointMake(300, 50)];
[path addLineToPoint:CGPointMake(200, 150)];
// 最后的闭合线是可以通过调用closePath方法来自动生成的,也可以调用-addLineToPoint:方法来添加
// [path addLineToPoint:CGPointMake(50, 50)];
[path closePath];
path.lineWidth = 5.0f;
[path stroke];

创建矩形

UIBezierPath *path = [UIBezierPath bezierPathWithRect:CGRectMake(50, 100, 50, 50)];
path.lineWidth = 5.0f;
[path stroke];

创建内切曲线

UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(50, 200, 50, 50)];
path.lineWidth = 5.0f;
[path stroke];

 UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(50, 200, 50, 100)];
 path.lineWidth = 5.0f;
 [path stroke];

创建带有圆角的矩形,当矩形变成正圆的时候,Radius就不再起作用

UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(50, 300, 50, 50) cornerRadius:15.0f];
path.lineWidth = 5.0f;
[path stroke];

设定特定的角为圆角的矩形

UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(50, 400, 50, 50) byRoundingCorners:UIRectCornerBottomLeft cornerRadii:CGSizeMake(5,5)];
path.lineWidth = 5.0f;
[path stroke];

创建圆弧

UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 550) radius:25 startAngle:0 endAngle:1.5*M_PI clockwise:YES];
path.lineWidth = 5.0f;
[path stroke];

通过路径A创建路径B

UIBezierPath *path_A = [UIBezierPath bezierPath];
[path_A moveToPoint:CGPointMake(200, 50)];
[path_A addLineToPoint:CGPointMake(250, 100)];
path_A.lineWidth = 5.0f;
UIBezierPath *path_B = [UIBezierPath bezierPathWithCGPath:path_A.CGPath];
[path_B stroke];

创建三次贝塞尔曲线

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(100, 200)];
[path addCurveToPoint:CGPointMake(300, 200) controlPoint1:CGPointMake(150, 150) controlPoint2:CGPointMake(250, 250)];
[path stroke];

创建二次贝塞尔曲线

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(100, 200)];
[path addQuadCurveToPoint:CGPointMake(300, 200) controlPoint:CGPointMake(150, 150)];
[path stroke];

添加圆弧

 UIBezierPath *path = [UIBezierPath bezierPath];
 [path moveToPoint:CGPointMake(200, 400)];
 [path addLineToPoint:CGPointMake(225, 410)];
 [path addArcWithCenter:CGPointMake(200, 400) radius:25 startAngle:0 endAngle:1.5*M_PI clockwise:YES];
// [path closePath];
// [path removeAllPoints];
 [path stroke];

追加路径

UIBezierPath *path_A = [UIBezierPath bezierPath];
[path_A moveToPoint:CGPointMake(200, 500)];
[path_A addLineToPoint:CGPointMake(225, 410)];
UIBezierPath *path_B = [UIBezierPath bezierPath];
[path_B moveToPoint:CGPointMake(200, 600)];
[path_B addLineToPoint:CGPointMake(225, 500)];
[path_A appendPath:path_B];
[path_A stroke];

创建翻转路径,即起点变成终点,终点变成起点

 UIBezierPath *path = [UIBezierPath bezierPath];
 [path moveToPoint:CGPointMake(50, 50)];
 [path addLineToPoint:CGPointMake(100, 50)];
 path.lineWidth = 5.0f;
 NSLog(@"%@",NSStringFromCGPoint(path.currentPoint));
 UIBezierPath *path_b = [path bezierPathByReversingPath];
 CGAffineTransform transform = CGAffineTransformMakeTranslation(200, 0);
 [path_b applyTransform: transform];
 // 两条路径分别添加一条直接到 self.center
 [path addLineToPoint: CGPointMake(self.frame.size.width*0.5, self.frame.size.height*0.5)];
 [path_b addLineToPoint: CGPointMake(self.frame.size.width*0.5, self.frame.size.height*0.5)];
 NSLog(@"%@",NSStringFromCGPoint(path_b.currentPoint));
 [[UIColor redColor] set];
 [path stroke];
 [[UIColor blueColor] set];
 [path_b stroke];

路径进行仿射变换

 UIBezierPath *path = [UIBezierPath bezierPath];
 [path moveToPoint:CGPointMake(100, 50)];
 [path addLineToPoint:CGPointMake(200, 50)];
 CGAffineTransform transform = CGAffineTransformRotate(self.transform, M_PI_4);
 [path applyTransform:transform];
 path.lineWidth = 5.0f;
 [path stroke];

创建虚线

CGFloat dashStyle[] = {1.0f, 2.0f};
UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(50, 50)];
[path addLineToPoint:CGPointMake(100, 50)];
[path setLineDash:dashStyle count:2 phase:0.0];
[path stroke];

设置颜色

UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(100, 100, 100, 100)];
[[UIColor greenColor] setStroke];
[[UIColor redColor] setFill];
[path stroke];
[path fill];

设置描边混合模式

UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(100, 100, 100, 100)];
[[UIColor greenColor] setStroke];
path.lineWidth = 10.0f;
[path strokeWithBlendMode:kCGBlendModeSaturation alpha:1.0];
[path stroke];
 

UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(100, 100, 100, 100)];
 [[UIColor redColor] setFill];
 [path fillWithBlendMode:kCGBlendModeSaturation alpha:0.6];
 [path fill];

修改当前图形上下文的绘图区域可见,随后的绘图操作导致呈现内容只有发生在指定路径的填充区域

UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(100, 100, 100, 100)];
[[UIColor greenColor] setStroke];
[path addClip];
[path stroke];

结语

关于UIBezierPath的简单介绍就到这了,主要是用代码做了展示,属性跟方法,没详细去介绍,我觉得可以直接看苹果的api写的也蛮清楚的.或者自己试试不同的参数样式也能大概理解了.

核心动画跟贝赛尔曲线都有了简单的介绍了,接下来就可以动手做点简单的自定义动画了.

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持脚本之家!

相关文章

  • Swift 进阶 —— map 和 flatMap的使用

    Swift 进阶 —— map 和 flatMap的使用

    这篇文章主要介绍了Swift map和flatMap的相关资料,帮助大家更好的理解和使用Swift,感兴趣的朋友可以了解下
    2020-09-09
  • IOS多线程编程NSThread的使用方法

    IOS多线程编程NSThread的使用方法

    这篇文章主要介绍了IOS多线程编程NSThread的使用方法的相关资料,希望通过本文能帮助到大家,让大家理解使用多线程的方法,需要的朋友可以参考下
    2017-10-10
  • iOS 把图片保存到相册,并获取图片文件名的实例

    iOS 把图片保存到相册,并获取图片文件名的实例

    下面小编就为大家分享一篇iOS 把图片保存到相册,并获取图片文件名的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2017-12-12
  • iOS实现垂直滑动条效果

    iOS实现垂直滑动条效果

    这篇文章主要为大家详细介绍了iOS实现垂直滑动条效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-03-03
  • iOS App开发中UISearchBar搜索栏组件的基本用法整理

    iOS App开发中UISearchBar搜索栏组件的基本用法整理

    iOS开发组件中自带的UISearchBar提供了很多基础和好用的搜索栏UI功能,下面就来总结一下iOS App开发中UISearchBar搜索栏组件的基本用法整理,需要的朋友可以参考下
    2016-05-05
  • iOS获取当前设备WiFi信息的方法

    iOS获取当前设备WiFi信息的方法

    很多公司现在都在做免费WIFI,车站、公交、地铁、餐厅,只要是人员密集流动的地方就有WIFI,免费WIFI从最初的网页认证方式也逐渐向客户端认证方式偏移。本文主要介绍iOS获取当前设备WiFi信息的方法,有需要的可以参考借鉴。
    2016-09-09
  • iOS UIWebView实现禁止用户复制剪切功能

    iOS UIWebView实现禁止用户复制剪切功能

    这篇文章主要给大家介绍了iOS中的UIWebView如何实现禁止用户复制剪切的功能,文中给出了详细的示例代码,有需要的朋友们可以参考借鉴,下面来一起学习学习吧。
    2016-11-11
  • iOS开发中TabBar再次点击实现刷新效果

    iOS开发中TabBar再次点击实现刷新效果

    这篇文章主要介绍了iOS开发中TabBar再次点击实现刷新效果,实现方法也很简单,需要的朋友可以参考下
    2018-04-04
  • 仿IOS的越界回弹效果和左右滑动功能

    仿IOS的越界回弹效果和左右滑动功能

    本文主要给大家讲述了制作一个仿IOS的越界回弹效果和左右滑动功能,简易的侧滑菜单控件,对此有兴趣的朋友参考下学习下吧。
    2018-02-02
  • iOS开发数独小游戏实例

    iOS开发数独小游戏实例

    这篇文章主要为大家详细介绍了iOS开发数独小游戏实例,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-11-11

最新评论