[ios]ios画线 使用CGContextRef,CGPath和UIBezierPath来绘画
参考 :http://www.mgenware.com/blog/?p=493
这三种东西:CGContextRef
,CGPath
和UIBezierPath
。本质上都是一样的,都是使用Quartz来绘画。只不过把绘图操作暴露在不同的API层面上,在具体实现上,当然也会有一些细小的差别。
我们将主要使用这3个类型,绘制出同一张图片,如下,一个笑脸:
首先使用Quartz的CGPath
来做这张图。很简单,首先创建用于转移坐标的Transform,然后创建一个CGMutablePathRef
(属于CGPath
类型)对象。接着通过两个CGPathAddEllipseInRect
和一个CGPathAddArc
函数来绘制Path中的两个眼睛和一个嘴,注意把CGAffineTransform
的地址传进去,这样Transform才会应用。接着把这个创建好的CGPath
加入到当前CGContextRef
中,最后通过CGContextRef
执行绘画。
代码:
- (void)viewDidLoad
{
[super viewDidLoad]; //开始图像绘图
UIGraphicsBeginImageContext(self.view.bounds.size);
//获取当前CGContextRef
CGContextRef gc = UIGraphicsGetCurrentContext(); //创建用于转移坐标的Transform,这样我们不用按照实际显示做坐标计算
CGAffineTransform transform = CGAffineTransformMakeTranslation(, );
//创建CGMutablePathRef
CGMutablePathRef path = CGPathCreateMutable();
//左眼
CGPathAddEllipseInRect(path, &transform, CGRectMake(, , , ));
//右眼
CGPathAddEllipseInRect(path, &transform, CGRectMake(, , , ));
//笑
CGPathMoveToPoint(path, &transform, , );
CGPathAddArc(path, &transform, , , , , M_PI, NO);
//将CGMutablePathRef添加到当前Context内
CGContextAddPath(gc, path);
//设置绘图属性
[[UIColor blueColor] setStroke];
CGContextSetLineWidth(gc, );
//执行绘画
CGContextStrokePath(gc); //从Context中获取图像,并显示在界面上
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext(); UIImageView *imgView = [[UIImageView alloc] initWithImage:img];
[self.view addSubview:imgView];
}
接下来,我们不去使用CGPath
类型的相关函数,而完全使用CGContextRef
相关的函数,这些函数执行起来其实是和上面讲的的CGPath
完全等价的。
这里需要注意的是,完全使用CGContextRef
的话,Transform的应用需使用CGContextTranslateCTM
函数。
完整代码:
- (void)viewDidLoad
{
[super viewDidLoad]; //开始图像绘图
UIGraphicsBeginImageContext(self.view.bounds.size);
//获取当前CGContextRef
CGContextRef gc = UIGraphicsGetCurrentContext(); //使用CGContextTranslateCTM函数来转移坐标的Transform,这样我们不用按照实际显示做坐标计算
CGContextTranslateCTM(gc, , );
//左眼
CGContextAddEllipseInRect(gc, CGRectMake(, , , ));
//右眼
CGContextAddEllipseInRect(gc, CGRectMake(, , , ));
//笑
CGContextMoveToPoint(gc, , );
CGContextAddArc(gc, , , , , M_PI, NO);
//设置绘图属性
[[UIColor blueColor] setStroke];
CGContextSetLineWidth(gc, );
//执行绘画
CGContextStrokePath(gc); //从Context中获取图像,并显示在界面上
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
UIImageView *imgView = [[UIImageView alloc] initWithImage:img];
[self.view addSubview:imgView];
}
同样会绘制出上面的图形。
最后我们使用UIBezierPath
类型来完成上述图形,UIBezierPath
很有意思,它包装了Quartz的相关API,自己存在于UIKit
中,因此不是基于C的API,而是基于Objective-C对象的。那么一个非常重要的点是由于离开了Quartz绘图,所以不需要考虑Y轴翻转的问题,在画弧的时候,clockwise
参数是和现实一样的,如果需要顺时针就传YES
,而不是像Quartz环境下传NO
的。
其次椭圆的创建需使用bezierPathWithOvalInRect
方法,这里名字是Oral
而不是Quartz中的Ellipse
。
最后注意UIBezierPath
的applyTransform
方法需要最后调用。
完整代码:
- (void)viewDidLoad
{
[super viewDidLoad]; //开始图像绘图
UIGraphicsBeginImageContext(self.view.bounds.size); //创建UIBezierPath
UIBezierPath *path = [UIBezierPath bezierPath];
//左眼
[path appendPath:[UIBezierPath bezierPathWithOvalInRect:CGRectMake(, , , )]];
//右眼
[path appendPath:[UIBezierPath bezierPathWithOvalInRect:CGRectMake(, , , )]];
//笑
[path moveToPoint:CGPointMake(, )];
//注意这里clockwise参数是YES而不是NO,因为这里不知Quartz,不需要考虑Y轴翻转的问题
[path addArcWithCenter:CGPointMake(, ) radius: startAngle: endAngle:M_PI clockwise:YES];
//使用applyTransform函数来转移坐标的Transform,这样我们不用按照实际显示做坐标计算
[path applyTransform:CGAffineTransformMakeTranslation(, )];
//设置绘画属性
[[UIColor blueColor] setStroke];
[path setLineWidth:];
//执行绘画
[path stroke]; //从Context中获取图像,并显示在界面上
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
UIImageView *imgView = [[UIImageView alloc] initWithImage:img];
[self.view addSubview:imgView];
}
[ios]ios画线 使用CGContextRef,CGPath和UIBezierPath来绘画的更多相关文章
- iOS: 使用CGContextRef,CGPath和UIBezierPath来绘画
这三种东西:CGContextRef,CGPath和UIBezierPath.本质上都是一样的,都是使用Quartz来绘画.只不过把绘图操作暴露在不同的API层面上,在具体实现上,当然也会有一些细小的 ...
- ios cocos2d 画线出现闪烁问题
根据http://www.merowing.info/2012/04/drawing-smooth-lines-with-cocos2d-ios-inspired-by-paper/ 用cocos2d ...
- [修复] Firemonkey 画线问题(Android & iOS 平台)
问题:官方 QC 的一个 Firemonkey 移动平台画线问题: RSP-14309: [iOS & Android] Delphi 10.1 Berlin - drawing proble ...
- IOS Quartz 各种绘制图形用法---实现画图片、写文字、画线、椭圆、矩形、棱形等
// Only override drawRect: if you perform custom drawing. // An empty implementation adversely affec ...
- IOS 绘制基本图形( 画圆、画线、画圆弧、绘制三角形、绘制四边形)
// 当自定义view第一次显示出来的时候就会调用drawRect方法- (void)drawRect:(CGRect)rect { // 1.获取上下文 CGContextRef ctx = UIG ...
- iOS小画板画线总结
一:基本画线: 使用贝赛尔曲线画: //创建路径 UIBezierPath* aPath = [UIBezierPath bezierPath]; //设置线宽 aPath.lineWidth = 5 ...
- [ios]MKMapView中使用MKPolyline画线
参考:http://blog.sina.com.cn/s/blog_9e8867eb0101dt76.html 首先在MapView.h中 #import <MapKit/MapKit.h> ...
- CGContextRef 画线简单用法
CGContextRef CGContextMoveToPoint(context,150,50);//圆弧的起始点 CGContextAddArcToPoint(context,100,80,130 ...
- IOS 股票K线图、分时图
IOS 股票K线图.分时图,网上开源项目很少,质量也是参差不齐:偶尔搜索到看似有希望的文章,点进去,还是个标题党:深受毒害.经过一段时间的探索,终于在开源基础上完成了自己的股票K线图.分时图: 先放出 ...
随机推荐
- Python常用函数及说明
原文地址:博客园 CSDN 基本定制型C.__init__(self[, arg1, ...]) 构造器(带一些可选的参数)C.__new__(self[, arg1, ...]) 构造器(带一些可 ...
- php中in_array使用注意
可能会导致长耗时: http://www.jb51.net/article/41446.htm
- 013-安装VNC服务
(1)#001-安装#光盘iso文件安装mount /dev/cdrom /mntcd /mnt/Packagesrpm -ivh tigervnc*rpm -ivh tigervnc按两次tab键 ...
- 26最短路径之Floyd算法
Floyd算法 思想:将n个顶点的图G“分成”很多子图 每对顶点vi和vj对应子图Gij(i=0,1,…,n-1和j=0,1,…,n-1) 每对顶点vi和vj都保留一条顶点限于子图Gij中的最短路径P ...
- svn导出文件夹到另外目录export
svn导出文件夹到另外目录export 2.选择目录,下面两个选项不用勾选 3.有存在的文件选择overwrite覆盖,勾选下面的同样操作
- SpringBoot之统一异常处理
异常,不仅仅是程序运行状态的描述,还可以使得代码编写更加的规范 1.自定义异常:FieldValueInvalidException package com.geniuses.sewage_zer ...
- jenkin环境搭建
Jenkins是一个用Java编写的开源的持续集成(CI)工具,可持续.自动地构建/测试软件项目,监控一些定时执行的任务.具有开源,支持多平台和插件扩展,安装简单,界面化管理等特点. 1.下载并解 ...
- CSS3实现8种Loading效果【二】
CSS3实现8种Loading效果[二] 今晚吃完饭回宿舍又捣鼓了另外几种Loading效果,老规矩,直接“上菜“…… 注:gif图片动画有些卡顿,非实际效果! 第一种效果: 代码如下: < ...
- 在IBM学到的东西,到底对我的程序生涯产生了多大的影响
我和很多人交流过一个有趣的现象,那就是刚毕业到30岁这段时间,会觉得时间过得很慢,总觉得自己还很年轻,但是一旦过了30岁,时间就如白驹过隙,一年又一年飞逝而过. 我自己也是,眼瞅着毕业快15年了,15 ...
- 深入浅出JVM
这篇文章简要解析了JVM的内部结构.下面这幅图展示了一个典型的JVM(符合JVM Specification Java SE 7 Edition)所具备的关键内部组件. 上图展示的所有这些组件都将在下 ...