CA*Layer(CATransformLayer--CAGradientLayer)

CATransformLayer

CATransformLayer不同于普通的CALayer,因为它不能显示它自己的内容。只有当存在了一个能作用域子图层的变换它才真正存在。CATransformLayer并不平面化它的子图层,所以它能够用于构造一个层级的3D结构,比如我的手臂示例。

我们将通过旋转camara来解决图层平面化问题而不是像立方体示例代码中用的sublayerTransform。这是一个非常不错的技巧,但是只能作用域单个对象上,如果你的场景包含两个立方体,那我们就不能用这个技巧单独旋转他们了。

那么,就让我们来试一试CATransformLayer吧,第一个问题就来了:在第五章,我们是用多个视图来构造了我们的立方体,而不是单独的图 层。我们不能在不打乱已有的视图层次的前提下在一个本身不是有寄宿图的图层中放置一个寄宿图图层。我们可以创建一个新的UIView子类寄宿在 CATransformLayer(用+layerClass方法)之上。但是,为了简化案例,我们仅仅重建了一个单独的图层,而不是使用视图。这意味着 我们不能像第五章一样在立方体表面显示按钮和标签,不过我们现在也用不到这个特性。

清单6.5就是代码。我们以我们在第五章使用过的相同基 本逻辑放置立方体。但是并不像以前那样直接将立方面添加到容器视图的宿主图层,我们将他们放置到一个CATransformLayer中创建一个独立的立 方体对象,然后将两个这样的立方体放进容器中。我们随机地给立方面染色以将他们区分开来,这样就不用靠标签或是光亮来区分他们。图6.5是运行结果。

清单6.5 用CATransformLayer装配一个3D图层体系

@interface ViewController ()

@property (nonatomic, weak) IBOutlet UIView *containerView;

@end

@implementation ViewController

- (CALayer *)faceWithTransform:(CATransform3D)transform

{

  //create cube face layer

  CALayer *face = [CALayer layer];

  face.frame = CGRectMake(-50, -50, 100, 100);

  //apply a random color

  CGFloat red = (rand() / (double)INT_MAX);

  CGFloat green = (rand() / (double)INT_MAX);

  CGFloat blue = (rand() / (double)INT_MAX);

  face.backgroundColor = [UIColor colorWithRed:red green:green blue:blue alpha:1.0].CGColor;

  //apply the transform and return

  face.transform = transform;

  return face;

}

- (CALayer *)cubeWithTransform:(CATransform3D)transform

{

  //create cube layer

  CATransformLayer *cube = [CATransformLayer layer];

  //add cube face 1

  CATransform3D ct = CATransform3DMakeTranslation(0, 0, 50);

  [cube addSublayer:[self faceWithTransform:ct]];

  //add cube face 2

  ct = CATransform3DMakeTranslation(50, 0, 0);

  ct = CATransform3DRotate(ct, M_PI_2, 0, 1, 0);

  [cube addSublayer:[self faceWithTransform:ct]];

  //add cube face 3

  ct = CATransform3DMakeTranslation(0, -50, 0);

  ct = CATransform3DRotate(ct, M_PI_2, 1, 0, 0);

  [cube addSublayer:[self faceWithTransform:ct]];

  //add cube face 4

  ct = CATransform3DMakeTranslation(0, 50, 0);

  ct = CATransform3DRotate(ct, -M_PI_2, 1, 0, 0);

  [cube addSublayer:[self faceWithTransform:ct]];

  //add cube face 5

  ct = CATransform3DMakeTranslation(-50, 0, 0);

  ct = CATransform3DRotate(ct, -M_PI_2, 0, 1, 0);

  [cube addSublayer:[self faceWithTransform:ct]];

  //add cube face 6

  ct = CATransform3DMakeTranslation(0, 0, -50);

  ct = CATransform3DRotate(ct, M_PI, 0, 1, 0);

  [cube addSublayer:[self faceWithTransform:ct]];

  //center the cube layer within the container

  CGSize containerSize = self.containerView.bounds.size;

  cube.position = CGPointMake(containerSize.width / 2.0, containerSize.height / 2.0);

  //apply the transform and return

  cube.transform = transform;

  return cube;

}

- (void)viewDidLoad

{?

  [super viewDidLoad];

  //set up the perspective transform

  CATransform3D pt = CATransform3DIdentity;

  pt.m34 = -1.0 / 500.0;

  self.containerView.layer.sublayerTransform = pt;

  //set up the transform for cube 1 and add it

  CATransform3D c1t = CATransform3DIdentity;

  c1t = CATransform3DTranslate(c1t, -100, 0, 0);

  CALayer *cube1 = [self cubeWithTransform:c1t];

  [self.containerView.layer addSublayer:cube1];

  //set up the transform for cube 2 and add it

  CATransform3D c2t = CATransform3DIdentity;

  c2t = CATransform3DTranslate(c2t, 100, 0, 0);

  c2t = CATransform3DRotate(c2t, -M_PI_4, 1, 0, 0);

  c2t = CATransform3DRotate(c2t, -M_PI_4, 0, 1, 0);

  CALayer *cube2 = [self cubeWithTransform:c2t];

  [self.containerView.layer addSublayer:cube2];

}

@end

CAGradientLayer

CAGradientLayer是用来生成两种或更多颜色平滑渐变的。用Core Graphics复制一个CAGradientLayer并将内容绘制到一个普通图层的寄宿图也是有可能的,但是CAGradientLayer的真正好处在于绘制使用了硬件加速。

基础渐变

我们将从一个简单的红变蓝的对角线渐变开始(见清单6.6).这些渐变色彩放在一个数组中,并赋给colors属性。这个数组成员接受CGColorRef类型的值(并不是从NSObject派生而来),所以我们要用通过bridge转换以确保编译正常。

CAGradientLayer也有startPoint和endPoint属性,他们决定了渐变的方向。这两个参数是以单位坐标系进行的定义,所以左上角坐标是{0, 0},右下角坐标是{1, 1}。代码运行结果如图6.6

清单6.6 简单的两种颜色的对角线渐变

@interface ViewController ()

@property (nonatomic, weak) IBOutlet UIView *containerView;

@end

@implementation ViewController

- (void)viewDidLoad

{

  [super viewDidLoad];

  //create gradient layer and add it to our container view

  CAGradientLayer *gradientLayer = [CAGradientLayer layer];

  gradientLayer.frame = self.containerView.bounds;

  [self.containerView.layer addSublayer:gradientLayer];

  //set gradient colors

  gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor, (__bridge id)[UIColor blueColor].CGColor];

  //set gradient start and end points

  gradientLayer.startPoint = CGPointMake(0, 0);

  gradientLayer.endPoint = CGPointMake(1, 1);

}

@end

多重渐变

如果你愿意,colors 属性可以包含很多颜色,所以创建一个彩虹一样的多重渐变也是很简单的。默认情况下,这些颜色在空间上均匀地被渲染,但是我们可以用locations属性 来调整空间。locations属性是一个浮点数值的数组(以NSNumber包装)。这些浮点数定义了colors属性中每个不同颜色的位置,同样的, 也是以单位坐标系进行标定。0.0代表着渐变的开始,1.0代表着结束。

locations数组并不是强制要求的,但是如果你给它赋值了就一定要确保locations的数组大小和colors数组大小一定要相同,否则你将会得到一个空白的渐变。

清单6.7展示了一个基于清单6.6的对角线渐变的代码改造。现在变成了从红到黄最后到绿色的渐变。locations数组指定了0.0,0.25和0.5三个数值,这样这三个渐变就有点像挤在了左上角。(如图6.7).

清单6.7 在渐变上使用locations

- (void)viewDidLoad {

    [super viewDidLoad];

    //create gradient layer and add it to our container view

    CAGradientLayer *gradientLayer = [CAGradientLayer layer];

    gradientLayer.frame = self.containerView.bounds;

    [self.containerView.layer addSublayer:gradientLayer];

    //set gradient colors

    gradientLayer.colors = @[(__bridge id)[UIColor redColor].CGColor, (__bridge id [UIColor yellowColor].CGColor, (__bridge id)[UIColor greenColor].CGColor];

    //set locations

    gradientLayer.locations = @[@0.0, @0.25, @0.5];

    //set gradient start and end points

    gradientLayer.startPoint = CGPointMake(0, 0);

    gradientLayer.endPoint = CGPointMake(1, 1);

}

时间: 2024-10-16 16:00:35

CA*Layer(CATransformLayer--CAGradientLayer)的相关文章

CA*Layer(CAShapeLayer--CATextLayer)

CAShapeLayer CAShapeLayer是一个通过矢量图形而不是bitmap来绘制的图层子类.你指定诸如颜色和线宽等属性,用CGPath来定义想要绘制的图 形,最后CAShapeLayer就自动渲染出来了.当然,你也可以用Core Graphics直接向原始的CALyer的内容中绘制一个路径,相比直下,使用CAShapeLayer有以下一些优点: 渲染快速.CAShapeLayer使用了硬件加速,绘制同一图形会比用Core Graphics快很多. 高效使用内存.一个CAShapeLa

CA*Layer(CAReplicatorLayer--)

CAReplicatorLayer (反射应用) 指定一个继承于UIView的ReflectionView,它会自动产生内容的反射效果: + (Class)layerClass//我们也可以通过重写View中的该方法来使其创建我们需要的layer类{    return [CAReplicatorLayer class];}- (void)setUp{    //configure replicator    CAReplicatorLayer *layer = (CAReplicatorLay

HDU 4374 One hundred layer(单调队列优化dp)

题意:有一个n*m的矩阵,每格有一个分数,一个人站在(1,x)位置,在每一行中,他只能朝一个方向走(向左或向右),且最多走t步,问走到最后第n行得到的最大分数. 思路:不难想到状态转移方程dp[i][j] = max(dp[i-1][k]+sum[i][j]-sum[i][k-1]),(k<j) 移项得 dp[i][j]-sum[i][j] = max(dp[i-1][k] - sum[i][k-1]); 方程右侧与i,j无关,所以可以用单调队列维护max(dp[i-1][k] - sum[i]

android图像处理系列之五--给图片添加边框(中)

前面一篇讲到给图片加边框的方式,只能给图片加一些有规则的边框,如果想加一些比较精美的效果,就有点麻烦了.下面就给出解决这个问题的思路. 思路是:一些比较精美的花边图片我们是很难用代码控制,就目前本人水平是达不到,不排除牛人,再说了PS那些效果都是程序员做出来,肯定有实现的方法,这可能就要涉及很复杂的图形学.扯远了,接来说怎么用那些精美的花边做为图片的边框.简单的方式是用两张图片叠加.最简单的一种是本文介绍的,用透明的PNG格式图片.因为Android是支持PNG图片处理的,而且PNG图片有透明度

iOS多线程开发(二)---线程管理

线程管理 线程管理包括创建,配置,退出三部分.主要包括创建线程的成本,线程创建,线程属性配置,线程主体入口函数编写,线程中断等 一,线程创建成本 1,为辅助线程分配的堆栈空间大小,便于系统和进程管理,以及为函数参数和局部变量分配空间 A,内核数据结构(kernel data structures)---大约1KB,This memory is used to store the thread data structures and attributes, much of which is all

苹果新的编程语言 Swift 语言进阶(十四)--扩展

Swift语言的扩展是为一个已经存在的类.结构.枚举类型添加新功能的一种方式,包括为不能存取源代码的那些已经存在的类型添加功能.        扩展类似于Objective-C语言中的类别,与类别不同的是Swift语言的扩展没有名字.        扩展能够为已存在类型:     1)增加计算属性和计算静态属性:     2)定义新的实例方法和类型方法:     3)提... 请转移到此位置继续阅读,谢谢! 苹果新的编程语言 Swift 语言进阶(十四)--扩展 苹果新的编程语言 Swift 语

iOS:实现图片的无限轮播(二)---之使用第三方库SDCycleScrollView

下载链接:github不断更新地址:https://github.com/gsdios/SDCycleScrollView 使用原理:采用UICollectionView的重用机制和循环滚动的方式实现图片的无限轮播,播放非常顺畅,解决了UISCrollView使用时从最后一张跳到第一张时的生硬状态. 主要类截图: SDCollectionViewCell:用来重用的item,即显示图片的视图: SDCycleScrollView: 对外提供的一个创建轮播器的接口类,使用者就是直接使用这个类来实现

visual c++ 2013进行MySQL编程(ODBC) -- (一) 套装安装

最近写了有些技术类文章了,只因为最近研究多了些东西,有一些项目用到了,所以自己记录一下,怕自己忘记,如果有哪位同学有自己的见解,可以邮件或者回复,技术类的探讨,不管对否,都是欢迎的. 操作之前,必须安装有Visual Studio 2013,其他的平台,我没有研究,我用的操作系统是Windows 8 Ultimate 64bit. 回到正题,vc数据库编程操作数据库Mysql,使用ODBC驱动接口. 而不是使用Mysql自带的C或者C++接口. 安装数据库,可以下面这个网址这里下载一个大的安装包

Android学习心得(16) --- Dex文件结构实例解析(2)

我在博客上发表一些我的Android学习心得,希望对大家能有帮助. 这一篇我们讲述一下通过一个实例来分析dex文件结构和组成. 参考Leb128数据类型 Android学习心得(5) --- dex数据类型LEB128 参考实例分析学习理解dex文件结构Android学习心得(15) --- Dex文件结构解析(1) 参考baksmali工具使用Android学习心得(4) --- MAC下smali文件编写与运行 1.编译 我们通过一个例子来分析dex文件的构成 创建一个Hello.java文