iOS Quartz2D画图

Posted 2020-07-26 卖报的男孩

对于刚接触Quartz2D的同学来说，先了解 上下文 的概念，再从最基础的画线来具体体验Quartz2D的画图步骤

介绍Quart2D ：是苹果官方的二维(平面)绘图引擎，同时支持ios和macOS系统，它的API是纯C语言的，它可以绘制图形、绘制文字、绘制图片、截图、自定义UI控件

在iOS开发中，Quartz2D最常用来自定义UI控件。

Quartz2D画图步骤: 1:获取图形上下文对象 2 向图形上下文对象中添加路径，绘图属性等等 3 渲染(把图形上下文中的路径绘制到对应的输出设备上)

介绍图形上下文(Graphics Context):是一个CGContextRef类型的数据。对于初学者，不要抱有很大压力，说白了就是我们小时候画图的时候，先要有草稿纸，在草稿纸先描绘一下，再誊抄到画板上，上下文其实就好比草稿纸。

图形上下文主要包含以下几个信息：1绘图路径(各种各样的图形:直线，三角形，圆形....) 2绘图状态:(颜色，线宽，样式，旋转...) 3输出目标:(绘制到什么地方去？UIView,图片，pdf...) 所以，相同的绘图序列，制定不同的上下文，就可以吧图形绘制到不同的目标上。如果概念大家看不明白的话，那就在代码中体验上下文的作用。

下面介绍5种绘图方式，大家慢慢体会

首先做一些准备工作：

接下来，打开自定义的类HFView.m文件，在-(void)drawRect:(CGRect)rect;方法中绘图

为什么要在这个方法里面绘图。1因为只有在这个方法中才可以获得图形上下文，在别的方法中无法获取到上下文，

并且-(void)drawRect:(CGRect)rect;无法在别的方法中调用，因为只有系统自己调用这个方法才能获取上下文，自己手动调用是获取不到上下文的

总结：绘图代码之所以写在-(void)drawRect:(CGRect)rect方法中，是因为：1 只有在这个方法中才能获取到上下文，2 这个方法只有系统调用的时候，才能获取上下文，自己在别的方法中手动调用，是获取不到上下文的。

下面，开始编写代码：

第一种：纯C语言，直接将路径添加到上下文中

 

第二种:纯C语言，先创建C路径，再添加到上下文里面

第三种:C语言，嵌套OC路径 

第四种：C语言 C路径嵌套OC路径

第五种 纯OC [大家可以体验面向对象的简单了]

以上为大家介绍了5中绘图方式，后面绘制图片，绘制文字，用的更多的是C路径OC路径一起使用，因为有一些功能，纯OC是无法实现的，所以大家着重练习使用第三种方式。

下面介绍一下绘图属性设置：

首先介绍C路径属性设置

线条属性设置有上面几种，感兴趣的同学可以试试，每个效果是什么样子的。

下面介绍OC路径的属性设置

 

开始的时候我们就说过，上下文中除了保存路径，还有绘图属性和输出目标，当渲染方法执行的时候，上下文栈会做出什么事情呢？

下面我们就来学习一下上下文栈的原理

写代码验证上面的推理

 

证明了我们的推理是正确地，上下文栈的原理也是这样子的。

下面给大家介绍常见图形的绘制方法，每种图形用一种方式绘制，感兴趣的同学可以尝试使用另外的方法绘制，熟练掌握几种绘图方法，让大家更深的体会Quartz2D 的绘图步骤

三角形的绘制：纯C语言，直接将路径添加到上下文中

也可以这样写

直角矩形 纯OC方式

圆角矩形，

因为OC路径有直接的类创建方法，使用起来更加方便，所以使用OC的

圆形，有很多方式，修改一下圆角矩形的数据就可以了

 

弧线的绘制

 

扇形的绘制 在弧线的基础上添加两条线

 

给大家介绍了Quartz2D的简单使用，以及简单图形的绘制。希望对大家有帮助