阴影是绘制在一个图形对象下的且有一定偏移的图片,它用于模拟光源照射到图形对象上所形成的阴影效果,如果7-1所示。文本也可以有阴影。阴影可以让一幅图像看上去是立体的或者是浮动的。

阴影有三个属性:

1.x偏移值,用于指定阴影相对于图片在水平方向上的偏移值。

2.y偏移值,用于指定阴影相对于图片在竖直方向上的偏移值。

3.模糊(blur)值,用于指定图像是有一个硬边(hard edge,如图7-2左边图片所示),还是一个漫射边(diffuse edge,如图7-1右边图片所示)

本章将描述阴影是如何工作的及如何用Quartz 2D API来创建阴影。

阴影是如何工作的

Quartz中的阴影是图形状态的一部分。我们可以调用函数CGContextSetShadow来创建,并传入一个图形上下文、偏移值及模糊值。阴影被设置后,任何绘制的对象都有一个阴影,且该阴影在设备RGB颜色空间中呈现出黑色的且alpha值为1/3。换句话说,阴影是用RGBA值{0,0, 0, 1.0/3.0}设置的。

我们可以调用函数CGContextSetShadowWithColor来设置彩色阴影,并传递一个图形上下文、偏移值、模糊值有CGColor颜色对象。颜色值依赖于颜色空间。

如何在调用CGContextSetShadow或CGContextSetShadowWithColor之前保存了图形状态,我们可以通过恢复图形状态来关闭阴影。我们也可以通过设置阴影颜色为NULL来关闭阴影。

基于图形上下文的阴影绘制惯例

偏移值指定了阴影相对于相关图像的位置。这些偏移值由图形上下文来描述,并用于计算阴影的位置:

· 一个正值的x偏移量指定阴影位于图形对象的右侧。

· 在Mac OS X中,正值的y指定阴影位于图形对象的上边,这与Quartz 2D默认的坐标值匹配。

· 在iOS中,如果我们用Quartz 2D API来创建PDF或者位图图形上下文,则正值的y指定阴影位于图形对象的上边。

· 在iOS中,如果图形上下文是由UIKit创建的,则正值的y指定阴影位于图形对象的下边。这与UIKit坐标系统相匹配。

· 阴影绘制惯例不受CTM影响

绘制阴影

按照如下步骤来绘制阴影

1.保存图形状态

2.调用函数CGContextSetShadow,传递相应的值

3.使用阴影绘制所有的对象

4.恢复图形状态

按照如下步骤来绘制彩色阴影

1.保存图形状态

2.创建一个CGColorSpace对象,确保Quartz能正确地解析阴影颜色

3.创建一个CGColor对象来指定阴影的颜色

4.调用CGContextSetShadowWithColor,并传递相应的值

5.使用阴影绘制所有的对象

6.恢复图形状态

图7-3显示了两个带有阴影的矩形,其中一个是彩色阴影。

列表清单显示了如何创建图7-3中的图像。

Listing 7-1 A functionthat sets up shadows

void MyDrawWithShadows (CGContextRef myContext, float wd, float ht);
{
CGSize myShadowOffset = CGSizeMake(-15, 20);
float myColorValues[] = {1, 0, 0, .6};
CGColorRef myColor;
CGColorSpaceRef myColorSpace;
CGContextSaveGState(myContext);
CGContextSetShadow (myContext,myShadowOffset, 5);
// Your drawing code here
CGContextSetRGBFillColor (myContext, 0, 1,0, 1);
CGContextFillRect (myContext, CGRectMake(wd/3 + 75, ht/2 , wd/4, ht/4)); myColorSpace = CGColorSpaceCreateDeviceRGB();
myColor = CGColorCreate (myColorSpace,myColorValues);
CGContextSetShadowWithColor (myContext,myShadowOffset, 5, myColor);
// Your drawing code here
CGContextSetRGBFillColor (myContext, 0, 0,1, 1);
CGContextFillRect (myContext, CGRectMake(wd/3-75,ht/2-100,wd/4,ht/4)); CGColorRelease (myColor);
CGColorSpaceRelease (myColorSpace); CGContextRestoreGState(myContext);
}

Quartz 2D编程指南(7) - 阴影(Shadows)的更多相关文章

  1. Quartz 2D编程指南(1) - 概览

    Quartz 2D编程指南是论坛会员德鲁伊翻译的国外的Quartz 2D一系列学习资料,供大家参考 Quartz 2D是一个二维图形绘制引擎,支持iOS环境和Mac OS X环境.我们可以使用Quar ...

  2. Quartz 2D编程指南(5) - 变换(Transforms)

    Quartz 2D 绘制模型定义了两种独立的坐标空间:用户空间(用于表现文档页)和设备空间(用于表现设备的本地分辨率).用户坐标空间用浮点数表示坐标,与设备空间的像素分辨率没有关系.当我们需要一个点或 ...

  3. Quartz 2D编程指南(4) - 颜色和颜色空间

    不同的设备(显示器.打印机.扫描仪.摄像头)处理颜色的方式是不同的.每种设备都有其所能支持的颜色值范围.一种设备能支持的颜色可能在其它设备中无法支持.为了有效的使用颜色及理解Quartz 2D中用于颜 ...

  4. Quartz 2D编程指南(2) - 图形上下文

    一个Graphics Context表示一个绘制目标.它包含绘制系统用于完成绘制指令的绘制参数和设备相关信息.Graphics Context定义了基本的绘制属性,如颜色.裁减区域.线条宽度和样式信息 ...

  5. Quartz 2D编程指南(2)图形上下文(Graphics Contexts)

    Graphics Contexts       一个Graphics Context表示一个绘制目标(也能够理解为图形上下文).它包括绘制系统用于完毕绘制指令的绘制參数和设备相关信息.Graphics ...

  6. Quartz 2D编程指南- PDF文档的创建、显示及转换

    PDF文档存储依赖于分辨率的向量图形.文本和位图,并用于程序的一系列指令中.一个PDF文档可以包含多页的图形和文本.PDF可用于创建跨平台.只读的文档,也可用于绘制依赖于分辨率的图形.         ...

  7. Quartz 2D Programming Guide

    Quartz 2D Programming  Guide 官方文档: Quartz 2D Programming Guide 译文: Quartz 2D编程指南(1) - 概览 Quartz 2D编程 ...

  8. iPhone之Quartz 2D系列--编程指南(1)概览

    以下几遍关于Quartz 2D博文都是转载自:http://www.cocoachina.com/bbs/u.php?action=topic&uid=38018 iPhone之Quartz ...

  9. Quartz2D 编程指南(二)变换、图案、阴影

    概览 图形上下文 路径 颜色与颜色空间 变换 图案 阴影 渐变 透明层 Quartz 2D 中的数据管理 位图与图像遮罩 CoreGraphics 绘制 Layer 5.变换 简介 Quartz 2D ...

随机推荐

  1. UIAutomation学习入门

    一.界面的自动化操作 .Ui自动化测试 .软件外挂 二.Win32基础知识 a.Win32中一切元素皆窗口,窗口之间有父子关系.整个桌面是一个“根窗口”. b.进程: 根据进程id拿到进程对象Proc ...

  2. mui app在线更新

    一参考资料 二代码 HTML代码 CSS代码 JS代码 接口代码 一.参考资料 http://ask.dcloud.net.cn/article/182 二.代码 1. HTML代码 <div ...

  3. mysql数据库优化课程---15、mysql优化步骤

    mysql数据库优化课程---15.mysql优化步骤 一.总结 一句话总结:索引优化最立竿见影 1.mysql中最常用最立竿见影的优化是什么? 索引优化 索引优化,不然有多少行要扫描多少次,1亿行大 ...

  4. 常见ADB命令

    常见ADB命令 比如说知道了push和pull操作,就可以实现一个简单的手机助手. 如果有多台设备,操作的时候要指定设备.  -s加设备名称

  5. 如何在 Ubuntu 中安装 QGit 客户端

    QGit是一款由Marco Costalba用Qt和C++写的开源的图形界面 Git 客户端.它是一款可以在图形界面环境下更好地提供浏览版本历史.查看提交记录和文件补丁的客户端.它利用git命令行来执 ...

  6. 搞懂分布式技术9:Nginx负载均衡原理与实践

    搞懂分布式技术9:Nginx负载均衡原理与实践 本篇摘自<亿级流量网站架构核心技术>第二章 Nginx负载均衡与反向代理 部分内容. 当我们的应用单实例不能支撑用户请求时,此时就需要扩容, ...

  7. vue中element 的上传功能

    element 的上传功能 最近有个需求,需要在上传文件前,可以进行弹窗控制是否上传upload 看完文档后,感觉有两种思路可以实现 基于before-upload :上传文件之前的钩子,参数为上传的 ...

  8. 【hive】多表插入

    from or_table insert overwrite table1 name1 select … insert into table2 name2 select … 注意:select 后边不 ...

  9. laravel中新建文件并保存数据到文件中

    //base_path()获取当前的绝对路径 $path=base_path().'\config\web.php'; $str='abcdefg'; //要声明的字符串 file_put_conte ...

  10. CF Round #456 (Div. 2)

    这时我第一次打CF 然后一看t1 哇好水 然后秒A了 看B 哇好像也很水 然后A了 看了C 不会... 然后去看D 似乎概率 然后推了一下,退出来了 然后看E 不会... 接着问了半个小时怎么hack ...