概述

Quartz 2D是一个二维绘图引擎,同时支持iOS和Mac系统。Quartz 2D能完成的工作:
  • 绘制图形 : 线条\三角形\矩形\圆\弧等
  • 绘制文字
  • 绘制\生成图片(图像)
  • 读取\生成PDF
  • 截图\裁剪图片
  • 自定义UI控件

代码实现

绘制时,绘制内容必须写在-(void)drawRect:(CGRect)rect 这个方法内,因为在其它方法里,取不到图形上下文。

绘制线条

#import "LineView.h"

@implementation LineView

-(void)drawRect:(CGRect)rect
{
// Drawing code
// 1.获得图形上下文
CGContextRef ctx = UIGraphicsGetCurrentContext(); // 2.拼接图形(路径)
// 设置线段宽度
CGContextSetLineWidth(ctx, ); // 设置线段头尾部的样式(圆型)
CGContextSetLineCap(ctx, kCGLineCapRound); // 设置线段转折点的样式(圆型)
CGContextSetLineJoin(ctx, kCGLineJoinRound); /** 第1根线段 **/
// 设置颜色
CGContextSetRGBStrokeColor(ctx, , , , );
// 设置一个起点
CGContextMoveToPoint(ctx, , );
// 添加一条线段到(100, 100)
CGContextAddLineToPoint(ctx, , ); // 渲染显示到view上面
CGContextStrokePath(ctx); /** 第2根线段 **/
// 设置颜色
CGContextSetRGBStrokeColor(ctx, , , , );
// 设置一个起点
CGContextMoveToPoint(ctx, , );
// 添加一条线段到(150, 40)
CGContextAddLineToPoint(ctx, , );
CGContextAddLineToPoint(ctx, , ); // 渲染显示到view上面
CGContextStrokePath(ctx);
}
@end

效果

绘制四边形

/**
* 画四边形
*/
void draw4Rect()
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext(); // 2.画矩形
CGContextAddRect(ctx, CGRectMake(, , , )); // set : 同时设置为实心和空心颜色
// setStroke : 设置空心颜色
// setFill : 设置实心颜色
[[UIColor whiteColor] set]; // 3.绘制图形
CGContextFillPath(ctx);
}

绘制三角形

/**
* 画三角形
*/
void drawTriangle()
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext(); // 2.画三角形
CGContextMoveToPoint(ctx, , );
CGContextAddLineToPoint(ctx, , );
CGContextAddLineToPoint(ctx, , );
// 关闭路径(连接起点和最后一个点)
CGContextClosePath(ctx); // 颜色
CGContextSetRGBStrokeColor(ctx, , , , ); // 3.绘制图形
CGContextStrokePath(ctx);
}

绘制圆形和圆弧

/**
* 画圆弧
*/
void drawArc()
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext(); // 2.画圆弧
// x\y : 圆心
// radius : 半径
// startAngle : 开始角度
// endAngle : 结束角度
// clockwise : 圆弧的伸展方向(0:顺时针, 1:逆时针)
CGContextAddArc(ctx, , , , M_PI_2, M_PI, ); // 3.显示所绘制的东西
CGContextFillPath(ctx);
} /**
* 画圆
*/
void drawCircle()
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext(); // 2.画圆
CGContextAddEllipseInRect(ctx, CGRectMake(, , , )); CGContextSetLineWidth(ctx, ); // 3.显示所绘制的东西
CGContextStrokePath(ctx);
}

常用方法

拼接函数

// 新建一个起点
void CGContextMoveToPoint(CGContextRef c, CGFloat x, CGFloat y) // 添加新的线段到某个点
void CGContextAddLineToPoint(CGContextRef c, CGFloat x, CGFloat y) // 添加一个矩形
void CGContextAddRect(CGContextRef c, CGRect rect) // 添加一个椭圆
void CGContextAddEllipseInRect(CGContextRef context, CGRect rect) // 添加一个圆弧
void CGContextAddArc(CGContextRef c, CGFloat x, CGFloat y,
CGFloat radius, CGFloat startAngle, CGFloat endAngle, int clockwise) // Mode参数决定绘制的模式
void CGContextDrawPath(CGContextRef c, CGPathDrawingMode mode) // 绘制空心路径
void CGContextStrokePath(CGContextRef c) // 绘制实心路径
void CGContextFillPath(CGContextRef c)

提示:一般以CGContextDraw、CGContextStroke、CGContextFill开头的函数,都是用来绘制路径的

图形上下文栈的操作

// 将当前的上下文copy一份,保存到栈顶(那个栈叫做”图形上下文栈”)
void CGContextSaveGState(CGContextRef c) // 将栈顶的上下文出栈,替换掉当前的上下文
void CGContextRestoreGState(CGContextRef c)

另:重绘方法setNeedsDisplay。比如,我们已经绘制了一个图片或者线条,想滑动改变尺寸,可以通过这样设置:

- (void)setImage:(UIImage *)image
{
_image = image; [self setNeedsDisplay];
}

源代码下载:点击下载

Quartz 2D 官方文档:点击下载

iOS UI进阶-1.0 Quartz2D的更多相关文章

  1. [iOS UI进阶 - 6.0] CALayer

    A.基本知识 1.需要掌握的 CALayer的基本属性 CALayer和UIView的关系 position和anchorPoint的作用   2.概念 在iOS中,你能看得见摸得着的东西基本上都是U ...

  2. [iOS UI进阶 - 3.0] 触摸事件的基本处理

    A.需要掌握和练习的 1.介绍事件类型2.通过按钮的事件处理引出view的事件处理3.响应者对象 --> UIResponder --> UIView4.view的拖拽* 实现触摸方法,打 ...

  3. [iOS UI进阶 - 2.0] 彩票Demo v1.0

    A.需求 1.模仿“网易彩票”做出有5个导航页面和相应功能的Demo 2.v1.0 版本搭建基本框架   code source:https://github.com/hellovoidworld/H ...

  4. iOS UI进阶-4.0 地图与定位

    在移动互联网时代,移动app能解决用户的很多生活琐事,比如 导航:去任意陌生的地方 周边:找餐馆.找酒店.找银行.找电影院   在上述应用中,都用到了地图和定位功能,在iOS开发中,要想加入这2大功能 ...

  5. [iOS UI进阶 - 4.0] 涂鸦app Demo

    A.需求 1.超简易画图,只有一种画笔 2.清屏功能 3.回退功能 4.保存功能 5.使用了cocos2D   code source: https://github.com/hellovoidwor ...

  6. iOS UI进阶-3.0 核心动画

    Core Animation是一组非常强大的动画处理API,使用它能做出非常炫丽的动画效果,而且往往是事半功倍,使用它需要先添加QuartzCore.framework和引入对应的框架<Quar ...

  7. iOS UI进阶-2.0 CALayer

    在iOS中,你能看得见摸得着的东西基本上都是UIView,比如一个按钮.一个文本标签.一个文本输入框.一个图标等等,这些都是UIView 其实UIView之所以能显示在屏幕上,完全是因为它内部的一个图 ...

  8. iOS UI进阶-1.1 Quartz2D 图片水印/裁剪/截图

    图片水印 UIImage+MJ.h #import <UIKit/UIKit.h> @interface UIImage (MJ) /** * 打水印 * * @param bg 背景图片 ...

  9. [iOS UI进阶 - 5.0] 手势解锁Demo

    A.需求 1.九宫格手势解锁 2.使用了绘图和手势事件   code source: https://github.com/hellovoidworld/GestureUnlockDemo     B ...

随机推荐

  1. [No0000F4]C# 枚举(Enum)

    枚举是一组命名整型常量.枚举类型是使用 enum 关键字声明的. C# 枚举是值数据类型.换句话说,枚举包含自己的值,且不能继承或传递继承. 声明 enum 变量 声明枚举的一般语法: enum &l ...

  2. [No0000BC]ADO.NET中的几个主要对象

    ADO 指 ActiveX 数据对象(ActiveX Data Objects). 从一个 ASP 页面内部访问数据库的通常的方法是: 创建一个到数据库的 ADO 连接 打开数据库连接 创建 ADO ...

  3. centos 安装oracle 报Checking swap space: 0 MB available, 150 MB required. Failed <<<<

    1 系统环境 centos 6.5 oracle 11g 内存 16G 硬盘 ssd 250G 2 运行安装命令: [oracle@localhost database]$ ./runInstalle ...

  4. python-----多线程、线程池、进程池

    import threadingimport time ###############################多线程################################------ ...

  5. Arcengine 在SDE创建数据集提示应用程序未获得创建或修改此类型数据的方案的许可

    解决方案:将license Control的属性修改一下,ArcGIS Engine的√去掉,把第二个打√就可以了: 参考资料:http://www.docin.com/p-925448534.htm ...

  6. iOS开发 - 事件传递响应链

    序言 当我们在使用微信等工具,点击扫一扫,就能打开二维码扫描视图.在我们点击屏幕的时候,iphone OS获取到了用户进行了“单击”这一行为,操作系统把包含这些点击事件的信息包装成UITouch和UI ...

  7. jquery基础学习之动画篇(四)

    一,动画效果 hide() show() 隐藏与显示 hide(options) 隐藏 对应display:none,有参数就会变成动画, $(document).click(function () ...

  8. python练习题-day6

    1.老男孩好声⾳选秀⼤赛评委在打分的时候呢, 可以进⾏输入. 假设, 老男孩有10个评委. 让10个评委进⾏打分, 要求, 分数必须⼤于5分, ⼩于10分. pingwei=["a" ...

  9. MySQL之——崩溃-修复损坏的innodb:innodb_force_recovery

    转: https://blog.csdn.net/l1028386804/article/details/77199194 一.问题描述 今天在线运行的一个mysql崩溃了. 查看错误日志,如下: - ...

  10. 比Xshel更好用的 FinalShell

    FinalShell功能特点: 1.多平台支持Windows,Mac OS X,Linux 2.多标签,批量服务器管理. 3.支持登录Ssh和Windows远程桌面. 4.漂亮的平滑字体显示,内置10 ...