学习笔记 - Quartz 2D绘图 -

转载自：http://www.cnblogs.com/monicaios/p/3516733.html

一、Quartz 2D

Quartz 2D 是一个二维图形绘制引擎，支持 iOS 环境和 Mac OS X 环境。

Quartz 2D 以 PDF 的规范为基础的图形库，用来绘制二维文字和图形，允许相同的绘图指令在任何装置上，使用可以得到的最佳分辨率，产生相同的输出

Quartz 2D API 可以实现许多功能，如基于路径的绘图、透明度、阴影、颜色管理、反锯齿、 PDF文档生成和 PDF 元数据访问等

Quartz 2D API 是 Core Graphics 框架的一部分，因此其中的很多数据类型和方法都是以CG 开头的。会经常见到 Quartz 2D （ Quartz ）和 Core Graphics 两个术语交互使用

Quartz 2D 与分辨率和设备无关，因此在使用 Quartz 2D 绘图时，无需考虑最终绘图的目标设备

二、图形  vs  图像

概念

图形：以路径的方式描述的一个形状，在应用程序运行时，实时绘制（渲染 /Rending ）的形状

图像：是以二进制数据的形式描述的一块像素点阵，在应用程序运行时，直接将该像素点阵逐一绘制在屏幕上

对比

图像：可以借助第三方工具，如 PhotoShop 、 Adobe Illustrator等预先绘制并以文件的形式保存，能够在应用程序中显示非常炫丽的图片

图形：需要通过代码绘制路径的方式实现，如果要绘制比较华丽的图像，需要非常复杂的算法，但是在绘制简单形状时，其速度和性能要远远高于图像

在应用程序开发时，界面 UI 上经常会需要使用简单的形状或色块加以点缀。另外，随着 iOS 7的扁平化设计理念的普及，原有的拟物化的图片将会被越来越多的图形替代！

为了提高程序的视觉效果及性能，苹果官方建议使用 PNG 格式的图像

如果是使用 AI 等矢量软件绘制的图形，在输出图像时，最好针对需要的分辨率重新渲染

三、Core Graphics

Core Graphic 框架是一组基于 C 的 API，可以用于一切绘图操作，这个框架的重要性，仅次于 UIKit 和 Foundation

当使用 UIKit 创建按钮、标签或者其他 UIView 的子类时，UIKit 会用 Core Graphics 将这些元素绘制在屏幕上。此外，UIEvent （ UIKit 中的事件处理类）也会使用 Core Graphics ，用来帮助确定触摸事件在屏幕上所处的位置

因为 UIKit 依赖于 Core Graphics ，所以当引入<UIKit/Uikit.h> 时， Core Graphics 框架会被自动引入，即UIKit 内部已经引入了 Core Graphics 框架的主头文件：<CoreGraphics/CoreGraphics.h>

为了让开发者不必触及底层的 Core Graphics 的 C 接口，UIKit 内部封装了 Core Graphics 的一些API ，可以快速生成通用的界面元素。但是，有时候直接利用 Core Graphics的 C 接口是很有必要和很有好处的，比如创建一个自定义的界面元素

四、Quartz 2D 的几个重要概念

在哪里绘图？

图形上下文（ Graphics Context ）

如何绘图？

Quartz 2D 坐标系

绘图顺序

UIView 的 drawRect: 方法

Quartz 2D 的内存管理

五、图形上下文（ Graphics Context ）

Graphics Context 是一个数据类型 (CGContextRef) ，封装了Quartz 绘制图像到输出设备的信息。输出设备可以是 PDF 文件、Bitmap 或者显示器的窗口上

Quartz 中所有的对象都是绘制到一个 Graphics Context 中

当用 Quartz 绘图时，所有设备相关的特性都包含在 Graphics Context中。换句话说，我们可以简单地给 Quartz 绘图序列指定不同的 Graphics Context，就可将相同的图像绘制到不同的设备上。而不需要任何设备相关的计算，这些都由 Quartz 替我们完成

Quartz 提供了以下几种类型的 Graphics Context ：

Bitmap Graphics Context

PDF Graphics Context

Window Graphics Context

Layer Graphics Context

Printer Graphics Context

一个 Graphics Context 表示一个绘制目标。它包含绘制系统用于完成绘制指令的绘制参数和设备相关信息

Graphics Context 定义了基本的绘制属性，如颜色、裁减区域、线条宽度和样式信息、字体信息、混合模式等

在 iOS 应用程序中，如果要在屏幕上进行绘制，需要创建一个 UIView 对象，并实现它的 drawRect: 方法。视图的 drawRect:方法在视图显示在屏幕上及它的内容需要更新时被调用

在调用自定义的 drawRect: 后，视图对象自动配置绘图环境以便能立即执行绘图操作

作为配置的一部分，视图对象将为当前的绘图环境创建一个 Graphics Context 。通过调用 UIGraphicsGetCurrentContext() 方法可以获取当前的 Graphics Context

六、Quartz 2D 坐标系

Quartz 中默认的坐标系统是：原点 (0, 0) 在左下角。沿着 X 轴从左到右坐标值逐渐增大；沿着 Y 轴从下到上坐标值逐渐增大

有一些技术在设置它们的 graphics context 时使用了不同于 Quartz的默认坐标系统。最常见的一种修改的坐标系统是原点位于左上角，而沿着 Y 轴从上到下坐标值逐渐增大。例如：UIView 中的 UIGraphicsGetCurrentContext 方法返回的图形上下文就是用的是这种坐标系

七、UIKit 的坐标系

原点 (0,0) 在屏幕的左上角， X 轴向右正向延伸，Y 轴向下正向延伸

iOS 的像素分辨率会随设备的硬件而变化， iPhone4 第一次引入了视网膜屏幕，像素分辨率为960 * 640 ，刚好是前一代 iPod 和 iPhone 像素分辨率（  480 * 320 ）的两倍

在绘图时，需要使用“点”的概念来思考问题，而不是像素。也就是说在点坐标系中绘图，不是硬件的像素坐标系

虽然这些设备的像素分辨率不同，但用到的坐标系保持不变 ( 以点为单位 ) 。在 iPhone4 上，一个点会用 2 像素宽度来绘制

提示：如果绘图的上下文，是使用 UIGraphicsGetCurrentContext 或者其他以 UI 开头的方法获取到的，在绘图时无需进行坐标转换

八、Quartz 2D 坐标系——坐标系的转换

CGContextRotateCTM(CGContextRef c, CGFloat angle) 方法可以相对原点旋转上下文坐标系

CGContextTranslateCTM(CGContextRef c, CGFloat tx, CGFloat ty) 方法可以相对原点平移上下文坐标系

CGContextScaleCTM(CGContextRef c, CGFloat sx, CGFloat sy) 方法可以缩放上下文坐标系

注意：

转换坐标系前，使用 CGContextSaveGState(CGContextRef c) 保存当前上下文状态

坐标系转换后，使用 CGContextRestoreGState(CGContextRef c) 可以恢复之前保存的上下文状态

九、利用 Quartz 2D 绘制 UIView

当在 UIView 子类中重写 drawRect: 方法时，iOS 会自动准备好一个图形上下文，可以通过调用 UIGraphicsGetCurrentContext()来获取

只要一个 UIView 需要被刷新或者重绘， drawRect: 方法就会被调用，所以 drawRect: 的调用频率很高

需要注意的是：重绘时应该调用 setNeedsDisplay ，而不能直接调用 drawRect:， setNeedsDisplay 会自动调用 drawRect:

十、drawRect: 注意事项

drawRect: 是在 UIViewController 的 loadView和 viewDidLoad 两方法之后调用的

如果在 UIView 初始化时没有设置 CGRect ，drawRect: 将不会被自动调用

如果设置 UIView 的 contentMode 属性值为UIViewContentModeRedraw ，那么将在每次更改 frame 时自动调用 drawRect:

如果使用 UIView 绘图，只能在 drawRect: 方法中获取相应的CGContextRef 并绘图。而在其他方法中获取的 CGContextRef 不能用于绘图

十一、Quartz 内存管理

使用含有“ Create ”或“ Copy ”的函数创建的对象，使用完后必须释放，否则将导致内存泄露

使用不含有“ Create ”或“ Copy ”的函数获取的对象，则不需要释放

如果 retain 了一个对象，不再使用时，需要将其 release 掉。可以使用 Quartz 2D 的函数来指定 retain 和 release 一个对象。例如，如果创建了一个 CGColorSpace对象，则使用函数 CGColorSpaceRetain 和 CGColorSpaceRelease来 retain 和 release 对象。也可以使用Core Foundation 的 CFRetain 和 CFRelease 。注意不能传递 NULL 值给这些函数

十二、Quartz 2D 绘图的基本步骤

1.  获取与视图相关联的上下文对象

UIGraphicsGetCurrentContext

2.  创建及设置路径 （ path ）

2.1  创建路径

2.2  设置路径起点

2.3  增加路径内容……

3.  将路径添加到上下文 

4.  设置上下文属性 

边线颜色、填充颜色、线宽、线段连接样式、线段首尾样式、虚线样式…

5.  绘制路径

6.  释放路径

十三、Quartz 2D 绘图的基础元素——路径

路径定义了一条或者或多条形状或子路径

子路径可以包含一条或者多条直线或曲线

子路径也可以是一些简单的形状，例如线、圆形、矩形或者星型等

子路径还可以包含复杂的形状，例如地图轮廓或者涂鸦等

路径可以是开放的，也可以是封闭的；对于封闭路径可以空心的也可以是实心的

十四、路径的创建与绘制

路径的创建和绘制是各自独立的任务

可以绘制空心路径、实心路径，或者即绘制路径的边线又填充路径的内容

还可以将路径作为剪切区域，用于将其他对象的绘制约束在路径的区域范围之内

十五、iOS7 中预定义的字符属性

NSString *text = @ “床前明月光，疑是地上霜 ";

UIFont *font = [UIFont systemFontOfSize:18];

NSDictionary *dict = @{NSFontAttributeName: font};

CGRect rect = [text boundingRectWithSize:CGSizeMake(24, 1000) options:NSStringDrawingUsesLineFragmentOrigin attributes:dict context:nil];

十六、线性渐变 & 径向渐变

参数说明：

context:  上下文

gradient:  渐变

startCenter:   渐变开始的起始点坐标

startRadius ：渐变开始的起始点半径，如果为 0 ，则从中心点开始发生渐变

endCenter ：渐变结束的圆心坐标，一般与起始点坐标相同，也可以略微变化，但是不要变得太远，可以调试看下效果

endRadius ： 渐变结束圆的半径

十七、生成添加水印的图像

开始图像上下文

绘制图像

添加水印文字

获取当前图像上下文中的图像结果

结束图像绘制上下文

返回绘制图像

十八、生成 PDF 文件

1.  创建 PDF 上下文

2.  新建 PDF 页面，默认大小 612 * 792

3.  结束 PDF 上下文

注意：

在处理 PDF 文件时，除了上下文之外，还需要考虑 PDF 的页面大小