图案是一个绘制操作的序列,绘制到图形上下文中的一个序列。你可以使用模式就和你挑选你喜欢的颜色一样。当你使用一个模式时,Quartz将页面分为一组模式单元,每个单元格都是模式图像的大小,并使用你提供的回调函数绘制每一个单元格。图6-1显示的图案绘制到窗口图形上下文。
The Anatomy of a Pattern 图案的解剖
可以看到 图案被解剖为一个个小的单元格。
当你不想使用Quartz 改变patterncell 时,你可以指定 特别的矩阵来达到这个效果。
Colored Patterns and Stencil (Uncolored) Patterns 彩色图案与无色模式
彩色图案具有与它们相关的固有颜色。改变用于创建模式单元的着色,而模式失去它的意义
您可以创建任何类型的图案着色或模具。
Tiling 平铺
平铺是渲染pattern cell的一部分的过程。当Quartz向一个设备呈现一个图案时,Quartz可能需要调整图案以适应设备空间。也就是说,在用户空间中定义的模式单元由于在用户空间单元和设备像素之间的差异而被渲染到设备时可能无法完全匹配。
How Patterns Work 如何工作
图案的操作和颜色差不多,填充颜色需要两步:CGContextSetFillColor以及调用CGContextFillRect。 填充图案也同样:CGContextSetFillPattern以及CGContextFillRect、CGContextSetFillPattern。多了一步指定pattern。
举个列子:当你使用pattern 绘制时Quartz在幕后做了什么;在你填充或者描边的时候,Quartz做了以下几步针对每个pattern cell:
1. 保存图形状态;
2. 将当前转换矩阵转换为模式单元的原点。
3.连接CTM 与图案矩阵
4.剪辑包围pattern cell 的矩形框
5.调用绘图机制绘制模式单元格
6.恢复图形状态。
Painting Colored Patterns 绘制彩色图案
当你 需要去绘制彩色图案时,你需要执行以下5步。
1.写一个调用着色模式单元格的回调函数
2.设置彩色图案颜色空间
3.解剖彩色图案为单元格
4.指定彩色图案作为填充或者描边的图案
5.开始绘制彩色图案咯
这些步骤中有一些和绘制模板图案(无色)是相同的,两个的区别就在于着色。你可以看这些步骤是如何协同工作的:A Complete Colored Pattern Painting Function.
⭐️ 第一步:写一个调用着色模式单元格的回调函数
一个单元格的样式完全取决于你,例如,列表6-1的绘制单元格的代码 在图6-2中得到了充分的展示,回想下单元格周围的分割线,这些分割线并不是单元格的一部分,它绘制的边界要大于代码所绘制的矩形框。后面你需要制定图案size。
绘制图案调用单元格函数:
typedef void (*CGPatternDrawPatternCallback) ( //你可以自己命名函数,下表6-1就命名的是MyDrawColoredPattern. 这个回调函数有两个参数
void *info, //info 参数,是个指针指向与模式相关的私有数据。这个参数是可以选择的,你也可以传个空NULL,你传递给回调函数的数据和当你后面创建模式提供的数据是一样的,
CGContextRef context//绘制单元格的上下文
);
通过6-1列表中的代码绘制的单元格是分割的,关于代码的重要细节:
图案大小被声明,你需要保存图案大小在你写代码的时候,这里大小被声明为一个全局的。绘图功能之前,原型是由CGPatternDrawPatternCallback 回调类型定义的。
⭐️ 第二步:设置彩色图案颜色空间
1°:创建你需要的颜色空间,传递NULL可以清空颜色空间
2°:设置填充或者描边
3°:释放颜色空间
⭐️ 第三步:解剖为单元格
单元格是一个CGPattern对象, 通过调用方法CGPatternCreate;
拉伸的参数值: kCGPatternTilingNoDistortion
kCGPatternTilingConstantSpacingMinimalDistortion
kCGPatternTilingConstantSpacing
isColored 决定了是否给单元格上色,如果传递true,那就需要设定颜色空间了。
最后一个参数是指向CGPatternCallbacks数据结构的指针。这个数据结构有三个字段:
第一个字段 设置为0 ,第二个字段是个指向回调的指针,第三个释放你传递给回到函数的iofo 参数,也可传递NULL;
⭐️ 第四步:指定图案的描边或者填充模式
需要传递的参数很明显。
⭐️ 第五步:开始绘制单元格
完成以上几步,就可以使用pattern 进行绘制了,你可以调用CGContextStrokePath,CGContextFillPath,CGContextFillRect;
下面的代码是完整的绘制彩色图案的方法
//1 声明一个CGPattern 对象,用于后来创建
//2 声明一个颜色空间,用户后来创建
//3 声明透明度为1,指定为完全不透明
//4 指定一个窗口的宽、高 。这个例子中,图案被画在一个窗口的区域上
//5 声明 并实现回调数据结构
//6 创建一个颜色空间对象,并且设置为空,当你绘制彩色图案时,图案在绘图回调中会使用它自己提供的颜色,这也就是牙呢空间置空的原因。
//7 使用刚刚创建的颜色 为上下文 上色。
//8 释放颜色空间
//9 传递空值,因为该图案不需要额外信息传递给回调
//10 指定单元格的边界 CGRect
//11 传入了一个CGAffintTransform 矩阵指定了如何从图案空间像上下文的用户空间的平移,这个例子中使用的是单位矩阵。
//12 传递每个单元格的水平位置。 这个例子中 单元格是相邻的。
//13 传递每个单元格的垂直大小,作为每个单元格开始之间的垂直位置。
//14.传递常量kCGPatternTilingConstantSpacing指定Quartz如何渲染图案。
//15 传递isColored 为True,指定图案为彩色图案
//16 传递一个执行回调结构的指针。
//17填充上下文 传递需要的参数
//18 释放CGPattern对象
//19 填充矩形框使用刚刚创建的上下文
Painting Stencil Patterns 绘制无色 模板图案
步骤和 会绘制彩色图案是一样的。
一个完整的绘制模板图案的方法
唯一不同的是 创建pattern的时候isColored 为false;
初学者,翻译的不好,也可参考这个Quartz 2D 之模式
demo地址:Quartz 2D 模式之demo