摘要:学习一简单绘制图形导语是一个二维图形绘制引擎,它支持环境和环境,为开发者提供了很多方便,它在绘图上的功能十分强大,如基于路径的绘图透明度阴影颜色管理反锯齿文档生成等。本篇内容将介绍和绘制图形的基本流程。
Quartz 2D学习(一)简单绘制图形 导语
一、Graphics ContextsQuartz 2D是一个二维图形绘制引擎,它支持iOS环境和Mac OS X环境,为开发者提供了很多方便,它在绘图上的功能十分强大,如基于路径的绘图、透明度、阴影、颜色管理、反锯齿、PDF文档生成等。Quartz 2D作为Core Graphics框架的一部分,其中的很多数据类型和方法都是以CG为前缀的。
本篇内容将介绍Graphis Context和绘制图形的基本流程。
Graphics context(图形上下文)可以比喻成一个画板,你可以定义颜色属性,画笔粗细,画笔是直线还是曲线,然后最后开始绘制。
使用Quartz 2D绘图的关键步骤有:
1.调用CGContextRef获取上下文
2.调用CGContextRef的方法来进行绘图
基本流程如下
- (void)drawRect:(CGRect)rect { //获取上下文 CGContextRef context = UIGraphicsGetCurrentContext(); //设置颜色属性,设置填充颜色 UIColor *blackColor = [UIColor colorWithRed:0 green:0 blue:0 alpha:1]; CGContextSetFillColorWithColor(context, blackColor.CGColor); //开始绘制 CGContextFillRect(context, rect); } //我设置的rect.frame = CGRectMake(0, 100, 100, 100);
于是可以得到一个原点在(0, 100) 大小为(100, 100)的黑色矩形。
如果我们想要在iOS应用上绘制图形,就必须先申请一个UIView对象,然后实现drawRect:方法。
在视图显示在屏幕上时或者内容需要更新时,drawRect:方法会被调用。所以我们不需要手动去调用这个方法。手动更新内容的方法是setNeedsDisplay。
UIView对象的可以通过CGContextRef对当前的绘图环境进行配置,如上文提到的获取上下文,设置颜色属性,设置填充属性等。
新建一个类继承自UIView,命名为Test。
//Test.h #import2. context的保存@interface Test : UIView @end //Test.m #import "Test.h" @implementation Test - (void)drawRect:(CGRect)rect { //获取上下文 CGContextRef context = UIGraphicsGetCurrentContext(); //1.绘制三角形 [self drawTriangle:context]; //2.绘制矩形,圆形,椭圆 [self drawOther:context]; } - (void)drawTriangle:(CGContextRef) context { //1.添加绘图路径 CGContextMoveToPoint(context, 100, 100); CGContextAddLineToPoint(context, 200, 100); CGContextAddLineToPoint(context, 150, 200); CGContextAddLineToPoint(context, 100, 100); //2.设置颜色属性 //以下定义类似于 // UIColor *redColor1 = [UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:1.0]; // redColor1.CGColor CGFloat redColor[4] = {1.0, 0.0, 0.0, 1.0}; CGFloat greenColor[4] = {0.0, 1.0, 0.0, 1.0}; //3.设置描边颜色,填充颜色 CGContextSetStrokeColor(context, redColor); CGContextSetFillColor(context, greenColor); //4.绘图 CGContextDrawPath(context, kCGPathFillStroke); } - (void)drawOther:(CGContextRef) context { //添加一个矩形 CGContextAddRect(context, CGRectMake(20, 100, 50, 50)); //添加一个圆形 CGContextAddEllipseInRect(context, CGRectMake(100, 200, 50, 50)); //添加一个椭圆 CGContextAddEllipseInRect(context, CGRectMake(100, 300, 50, 100)); //绘图 CGContextDrawPath(context, kCGPathFillStroke); } @end
从实例1中可以看出在绘制其他图形时,我们并没有设置描边属性,填充颜色等,但是后来绘制的图形却和第一个相同。正如开头所述的,context就像一个画板,你选择了画笔颜色,填充颜色,那么你之后画的所有图形都会是这样的属性。
那能不能不重新设置属性就可以用之前的“画板”呢?
我们可以在设置属性前保存context,当画完第一个图形后,再读取出来。
此时要用到两个方法。
CGContextSaveGState(context); //将context推入上下文堆栈
CGContextRestoreGState(context); //从上下文堆栈取出context
//Test.h #import@interface Test : UIView @end //Test.m #import "Test.h" @implementation Test - (void)drawRect:(CGRect)rect { //获取上下文 CGContextRef context = UIGraphicsGetCurrentContext(); //1.绘制三角形 [self drawTriangle:context]; //2.绘制矩形,圆形,椭圆 [self drawOther:context]; } - (void)drawTriangle:(CGContextRef) context { //保存context CGContextSaveGState(context); //1.添加绘图路径 CGContextMoveToPoint(context, 100, 100); CGContextAddLineToPoint(context, 200, 100); CGContextAddLineToPoint(context, 150, 200); CGContextAddLineToPoint(context, 100, 100); //2.设置颜色属性 //以下定义类似于 // UIColor *redColor1 = [UIColor colorWithRed:1.0 green:0.0 blue:0.0 alpha:1.0]; // redColor1.CGColor CGFloat redColor[4] = {1.0, 0.0, 0.0, 1.0}; CGFloat greenColor[4] = {0.0, 1.0, 0.0, 1.0}; //3.设置描边颜色,填充颜色 CGContextSetStrokeColor(context, redColor); CGContextSetFillColor(context, greenColor); //4.绘图 CGContextDrawPath(context, kCGPathFillStroke); } - (void)drawOther:(CGContextRef) context { //读取context CGContextRestoreGState(context); //添加一个矩形 CGContextAddRect(context, CGRectMake(20, 100, 50, 50)); //添加一个圆形 CGContextAddEllipseInRect(context, CGRectMake(100, 200, 50, 50)); //添加一个椭圆 CGContextAddEllipseInRect(context, CGRectMake(100, 300, 50, 100)); //绘图 CGContextDrawPath(context, kCGPathFillStroke); } @end
我们只需要在代码中添加很简单的两行就可以回溯到初始的context。
参考:苹果官方文档
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/15981.html
摘要:但是,对于一些特殊的情况,我们需要绘制产品狗想要的图形。四与圆角定制类是基于的,准确的说是基于的。应用场景对于某些需要绘制边框的需求,我们可以通过上述三四两种方式绘制边框。对于某些非矩形,并且使用系统不提供的样式显示的,我们需要进行自绘。 许多UIView的子类,如UIButton或UILabel,它们的形状都是系统固定的。但是,对于一些特殊的情况,我们需要绘制产品狗想要的图形。那么...
摘要:学习三自定义圆角按钮导语是一个二维图形绘制引擎,它支持环境和环境,为开发者提供了很多方便,它在绘图上的功能十分强大,如基于路径的绘图透明度阴影颜色管理反锯齿文档生成等。本篇内容将介绍自定义的实现。 Quartz 2D学习(三)自定义圆角按钮 导语 Quartz 2D是一个二维图形绘制引擎,它支持iOS环境和Mac OS X环境,为开发者提供了很多方便,它在绘图上的功能十分强大,如基于...
摘要:为了让像素能够显示到屏幕上面,有一些工作是需要的。有纹理位图合成为一帧比如秒帧每一个纹理占用显卡因此一次处理的纹理有大小限制。处理合成方面非常高效,但是有一些合成任务比其他要复杂,所以对处理能力有一个不能超过的限制秒帧。 译注:这篇文章虽然比较长,但是里面的内容还是很有价值的。 像素是如何绘制到屏幕上面的?把数据输出到屏幕的方法有很多,通过调用很多不同的framework和不同的函数...
摘要:链接在此新浪微博客户端架构与优化之路来自移动开发前线的分享。沙龙名额有限,想参加的同学快来报名吧网页链接安卓上款最佳黑客工具由黑客与极客微博分享。 今年的 Google I/O 大会上,人工智能和虚拟现实的产品发布让我们对未来多了几分惊喜。对于开发者部分,Google 发布了 Android N 系统,感受最深的是全新的 Android Studio 、 Firebase,赋予开发者更...
摘要:链接在此新浪微博客户端架构与优化之路来自移动开发前线的分享。沙龙名额有限,想参加的同学快来报名吧网页链接安卓上款最佳黑客工具由黑客与极客微博分享。 今年的 Google I/O 大会上,人工智能和虚拟现实的产品发布让我们对未来多了几分惊喜。对于开发者部分,Google 发布了 Android N 系统,感受最深的是全新的 Android Studio 、 Firebase,赋予开发者更...
阅读 3001·2021-11-25 09:43
阅读 3208·2021-11-11 16:54
阅读 581·2021-11-02 14:42
阅读 3520·2021-09-30 09:58
阅读 3490·2021-09-29 09:44
阅读 1068·2019-08-30 15:56
阅读 1902·2019-08-30 15:54
阅读 2813·2019-08-30 15:43