iOS开发之CALayer

简介:

1、概述

在iOS中,你能看得见摸得着的东西基本上都是UIView,比如一个按钮、一个文本标签、一个文本输入框、一个图标等等,这些都是UIView,其实UIView之所以能显示在屏幕上,完全是因为它内部的一个图层,在创建UIView对象时,UIView内部会自动创建一个图层(CALayer对象)通过UIView的layer属性可以访问这个层:

?
1
@property(nonatomic,readonly,retain) CALayer *layer;

UIView需要显示到屏幕上时,会调用drawRect:方法进行绘图,并且会将所有内容绘制在自己的图层上,绘图完毕后,系统会将图层拷贝到屏幕上,于是就完成了UIView的显示。

换句话说,UIView本身不具备显示的功能,是它内部的图层有显示功能。

2CALayer的属性

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
//宽度和高度:
@property CGRect bounds;
  
//位置(默认指中点,具体由anchorPoint决定):
@property CGPoint position;
  
//锚点(x,y的范围都是0-1),决定了position的含义:
@property CGPoint anchorPoint;
  
//背景颜色(CGColorRef类型):
@property CGColorRef backgroundColor;
  
//形变属性:
@property CATransform3D transform;
  
//边框颜色(CGColorRef类型):
@property CGColorRef borderColor;
  
//边框宽度:
@property CGFloat borderWidth;
  
//圆角半径:
@property CGColorRef borderColor;
  
//内容(比如设置为图片CGImageRef):
@property(retain) id contents;

例如:

 

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
//边框宽度
   self.iconView.layer.borderWidth = 10;
   // 边框颜色
   self.iconView.layer.borderColor = [UIColor greenColor].CGColor;
     // 圆角
     self.iconView.layer.cornerRadius = 10;
  
     // 超出主层边框范围的内容都剪掉
     self.iconView.layer.masksToBounds = YES;
    
     // 阴影颜色
     self.iconView.layer.shadowColor = [UIColor blueColor].CGColor;
     // 阴影偏差
     self.iconView.layer.shadowOffset = CGSizeMake(20, 20);
     // 阴影不透明度
self.iconView.layer.shadowOpacity = 0.5;

【备注】新建图层:

?
1
CALayer *layer = [[CALayer alloc]init];

或者:

?
1
CALayer *layer = [CALayer layer];

例如:

?
1
2
3
4
5
6
7
8
9
10
// 新建图层
//CALayer *layer = [[CALayer alloc] init];
     CALayer *layer = [CALayer layer];
     layer.backgroundColor = [UIColor redColor].CGColor;
     layer.bounds = CGRectMake(0, 0, 100, 100);
     layer.position = CGPointMake(200, 100);
     layer.cornerRadius = 10;
     layer.masksToBounds = YES;
     layer.contents = (id)[UIImage imageNamed:@ "lufy" ].CGImage;
[self.view.layer addSublayer:layer];

运行结果:

3x\y\z

坐标原点(0,0,0)

比如使图层宽度变成1.5倍,高度变成0.5倍:

?
1
self.iconView.layer.transform = CATransform3DMakeScale(1.5, 0.5, 0);

 

绕着(0,0,1)顺时针旋转45度,即绕着Z轴旋转45度:

?
1
self.iconView.layer.transform = CATransform3DMakeRotation(M_PI_4, 0, 0, 1);

上面旋转等价于:

?
1
2
3
NSValue *value = [NSValue valueWithCATransform3D:
CATransform3DMakeRotation(M_PI_4, 0, 0, 1)];
[self.iconView.layer setValue:value forKeyPath:@ "transform" ];

也等价于:

?
1
2
[self.iconView.layer setValue:@(M_PI_4) forKeyPath:
@ "transform.rotation" ];

 

4、         关于CALayer的疑惑

首先:

(1)CALayer是定义在QuartzCore框架中的

(2)CGImageRef、CGColorRef两种数据类型是定义在CoreGraphics框架中的

(1)UIColor、UIImage是定义在UIKit框架中的

其次:

(1)QuartzCore框架和CoreGraphics框架是可以跨平台使用的,在iOS和Mac OS X上都能使用

(2)但是UIKit只能在iOS中使用

(3)为了保证可移植性,QuartzCore不能使用UIImage、UIColor,只能使用CGImageRef、CGColorRef

5UIViewCALayer的选择

通过CALayer,就能做出跟UIView一样的界面效果,既然CALayer和UIView都能实现相同的显示效果,那究竟该选择谁好呢?

其实,对比CALayer,UIView多了一个事件处理的功能。也就是说,CALayer不能处理用户的触摸事件,而UIView可以。

所以,如果显示出来的东西需要跟用户进行交互的话,用UIView;如果不需要跟用户进行交互,用UIView或者CALayer都可以。

当然,CALayer的性能会高一些,因为它少了事件处理的功能,更加轻量级。

6positionanchorPoint

CALayer有2个非常重要的属性:position和anchorPoint:

@property CGPoint position;

(1)用来设置CALayer在父层中的位置

(2)以父层的左上角为原点(0, 0)

 

@property CGPoint anchorPoint;

(1)称为“定位点”、“锚点”,控件旋转动画围绕着锚点旋转

2)决定着CALayer身上的哪个点会在position属性所指的位置,可用来将控件放到指定位置(设置锚点并把锚点放到position位置)

(3)以自己的左上角为原点(0, 0)

4)它的xy取值范围都是0~1,默认值为(0.5, 0.5),即默认是重点

 

例如:

?
1
2
3
4
5
6
CALayer *layer = [CALayer layer];
     layer.bounds = CGRectMake(0, 0, 100, 100);
     layer.backgroundColor = [UIColor redColor].CGColor;
     layer.position = CGPointZero;
     layer.anchorPoint = CGPointZero;
     [self.view.layer addSublayer:layer];

7、隐式动画

每一个UIView内部都默认关联着一个CALayer,我们可用称这个Layer为Root Layer(根层)。

所有的非Root Layer,也就是手动创建的CALayer对象,都存在着隐式动画。

什么是隐式动画?

当对非Root Layer的部分属性进行修改时,默认会自动产生一些动画效果,而这些属性称为Animatable Properties(可动画属性)

几个常见的Animatable Properties

(1)bounds:用于设置CALayer的宽度和高度。修改这个属性会产生缩放动画

(2)backgroundColor:用于设置CALayer的背景色。修改这个属性会产生背景色的渐变动画

(3)position:用于设置CALayer的位置。修改这个属性会产生平移动画

可以通过动画事务(CATransaction)关闭默认的隐式动画效果:

?
1
2
3
4
[CATransaction begin];
[CATransaction setDisableActions:YES];
self.myview.layer.position = CGPointMake(10, 10);
[CATransaction commit];

上述代码执行将不会再有动画效果。

目录
相关文章
|
1月前
|
开发框架 前端开发 Android开发
安卓与iOS开发中的跨平台策略
在移动应用开发的战场上,安卓和iOS两大阵营各据一方。随着技术的演进,跨平台开发框架成为开发者的新宠,旨在实现一次编码、多平台部署的梦想。本文将探讨跨平台开发的优势与挑战,并分享实用的开发技巧,帮助开发者在安卓和iOS的世界中游刃有余。
|
11天前
|
iOS开发 开发者 MacOS
深入探索iOS开发中的SwiftUI框架
【10月更文挑战第21天】 本文将带领读者深入了解Apple最新推出的SwiftUI框架,这一革命性的用户界面构建工具为iOS开发者提供了一种声明式、高效且直观的方式来创建复杂的用户界面。通过分析SwiftUI的核心概念、主要特性以及在实际项目中的应用示例,我们将展示如何利用SwiftUI简化UI代码,提高开发效率,并保持应用程序的高性能和响应性。无论你是iOS开发的新手还是有经验的开发者,本文都将为你提供宝贵的见解和实用的指导。
98 66
|
21天前
|
开发框架 Android开发 iOS开发
安卓与iOS开发中的跨平台策略:一次编码,多平台部署
在移动应用开发的广阔天地中,安卓和iOS两大阵营各占一方。随着技术的发展,跨平台开发框架应运而生,它们承诺着“一次编码,到处运行”的便捷。本文将深入探讨跨平台开发的现状、挑战以及未来趋势,同时通过代码示例揭示跨平台工具的实际运用。
|
25天前
|
Java 调度 Android开发
安卓与iOS开发中的线程管理差异解析
在移动应用开发的广阔天地中,安卓和iOS两大平台各自拥有独特的魅力。如同东西方文化的差异,它们在处理多线程任务时也展现出不同的哲学。本文将带你穿梭于这两个平台之间,比较它们在线程管理上的核心理念、实现方式及性能考量,助你成为跨平台的编程高手。
|
27天前
|
存储 前端开发 Swift
探索iOS开发:从新手到专家的旅程
本文将带您领略iOS开发的奇妙之旅,从基础概念的理解到高级技巧的掌握,逐步深入iOS的世界。文章不仅分享技术知识,还鼓励读者在编程之路上保持好奇心和创新精神,实现个人成长与技术突破。
|
1月前
|
安全 IDE Swift
探索iOS开发之旅:从初学者到专家
在这篇文章中,我们将一起踏上iOS开发的旅程,从基础概念的理解到深入掌握核心技术。无论你是编程新手还是希望提升技能的开发者,这里都有你需要的指南和启示。我们将通过实际案例和代码示例,展示如何构建一个功能齐全的iOS应用。准备好了吗?让我们一起开始吧!
|
1月前
|
安全 Swift iOS开发
Swift 与 UIKit 在 iOS 应用界面开发中的关键技术和实践方法
本文深入探讨了 Swift 与 UIKit 在 iOS 应用界面开发中的关键技术和实践方法。Swift 以其简洁、高效和类型安全的特点,结合 UIKit 丰富的组件和功能,为开发者提供了强大的工具。文章从 Swift 的语法优势、类型安全、编程模型以及与 UIKit 的集成,到 UIKit 的主要组件和功能,再到构建界面的实践技巧和实际案例分析,全面介绍了如何利用这些技术创建高质量的用户界面。
33 2
|
1月前
|
安全 数据处理 Swift
深入探索iOS开发中的Swift语言特性
本文旨在为开发者提供对Swift语言在iOS平台开发的深度理解,涵盖从基础语法到高级特性的全面分析。通过具体案例和代码示例,揭示Swift如何简化编程过程、提高代码效率,并促进iOS应用的创新。文章不仅适合初学者作为入门指南,也适合有经验的开发者深化对Swift语言的认识。
53 9
|
1月前
|
vr&ar Android开发 iOS开发
安卓与iOS开发中的用户界面设计原则
【10月更文挑战第41天】探索移动应用开发的精髓,本文将深入分析安卓和iOS平台上用户界面设计的核心原则。通过比较两大操作系统的设计哲学,我们将揭示如何打造直观、易用且美观的应用程序界面。无论你是初学者还是资深开发者,这篇文章都将为你提供宝贵的见解和实用的技巧,帮助你在竞争激烈的应用市场中脱颖而出。
|
1月前
|
设计模式 Swift iOS开发
探索iOS开发:从基础到高级,打造你的第一款App
【10月更文挑战第40天】在这个数字时代,掌握移动应用开发已成为许多技术爱好者的梦想。本文将带你走进iOS开发的世界,从最基础的概念出发,逐步深入到高级功能实现,最终指导你完成自己的第一款App。无论你是编程新手还是有志于扩展技能的开发者,这篇文章都将为你提供一条清晰的学习路径。让我们一起开始这段旅程吧!