ios基础篇(十)—— CALayer基本属性

el/2024/4/20 14:42:20
  • 在iOS中,你能看得见摸得着的东西基本上都是UIView,比如一个按钮、一个文本标签、一个文本输入框、一个图标等等,这些都是UIView
  • 其实UIView之所以能显示在屏幕上,完全是因为它内部的一个图层
  • 在创建UIView对象时,UIView内部会自动创建一个图层(即CALayer对象),通过UIView的layer属性可以访问这个层 @property(nonatomic,readonly,retain) CALayer *layer;
  • UIView需要显示到屏幕上时,会调用drawRect:方法进行绘图,并且会将所有内容绘制在自己的图层上,绘图完毕后,系统会将图层拷贝到屏幕上,于是就完成了UIView的显示  
  • 换句话说,UIView本身不具备显示的功能,是它内部的层才有显示功能

CA: Core Animation (核心动画) 

CALayerUIView的关系

  • CALayer 负责视图中显示内容和动画
  • UIView 负责监听和响应事件

CALayer的基本属性

阴影、圆角大小、边框宽度和颜色

宽度和高度

 @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 CGFloat cornerRadius; 

内容(比如设置为图片CGImageRef)

@property(retain) id contents;
- (void)viewDidLoad{[super viewDidLoad];UIView* redView = [[UIView alloc] init];redView.frame = CGRectMake(100, 100, 100, 100);redView.backgroundColor = [UIColor redColor];// 1>边框redView.layer.borderWidth = 10; // 边框的宽度redView.layer.borderColor = [UIColor grayColor].CGColor; // 边框的颜色// 2>阴影redView.layer.shadowOffset = CGSizeZero; // 阴影的偏移量redView.layer.shadowColor = [UIColor blueColor].CGColor; // 阴影的颜色redView.layer.shadowRadius = 50; // 阴影的半径redView.layer.shadowOpacity = 1; // 阴影的透明度// 3>圆角redView.layer.cornerRadius = 50; // 圆角半径redView.layer.masksToBounds = YES; // 裁剪超出 layer 范围的东西// 4>bounds//    redView.layer.bounds = CGRectMake(0, 0, 200, 200);// 5>postion属性和view.center的关系 // 默认 center 跑到 position 的位置上//    redView.layer.position = CGPointMake(0, 0);// 6>设置内容(图片)redView.layer.contents = (__bridge id)([UIImage imageNamed:@"me"].CGImage);[self.view addSubview:redView];self.layer = redView.layer;
}- (void)touchesBegan:(NSSet<UITouch*>*)touches withEvent:(UIEvent*)event{//    self.layer.opacity = 0; // 透明度//    self.layer.bounds = CGRectMake(0, 0, 200, 200);// 获取触摸对象UITouch* t = touches.anyObject;// 获取手指当前的位置CGPoint p = [t locationInView:t.view];// 让layer 跑到手指的位置self.layer.position = p;
}
@end

如果想改layer的 x y 宽 高 --> 不要改frame 后面做动画会有问题 去改 layer的bounds和postion

self.view add subvie:redview;  白纸上面放了一张红色的纸

self.layer addsyblayer:redlayer;  白纸中间涂成了红色

UIView和CALayer的选择

  1. 通过CALayer,就能做出跟UIImageView一样的界面效果
  2. 既然CALayerUIView都能实现相同的显示效果,那究竟该选择谁好呢?
  • 其实,对比CALayerUIView多了一个事件处理的功能。也就是说,CALayer不能处理用户的触摸事件,而UIView可以

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

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

UIView : 接受和处理系统事件、触摸事件。

CALayer : 显示内容

隐式动画(可动画属性)

  • 每一个UIView内部都默认关联着一个CALayer,我们可称这个Layer为Root Layer(根层)
  • 所有的非Root Layer,也就是手动创建的CALayer对象,都存在着隐式动画

什么是隐式动画?

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

列举几个常见的Animatable Properties:

  • bounds:用于设置CALayer的宽度和高度。修改这个属性会产生缩放动画
  • backgroundColor:用于设置CALayer的背景色。修改这个属性会产生背景色的渐变动画
  • position:用于设置CALayer的位置。修改这个属性会产生平移动画

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

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

控件的根layer没有隐式动画  uiwidows下的就是根layer   

position和anchorPoint

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

@property CGPoint position;

  • 用来设置CALayer在父层中的位置
  • 以父层的左上角为原点(0, 0)

@property CGPoint anchorPoint;

  • 称为“定位点”、“锚点”
  • 决定着CALayer的position属性所指的是哪个点
  • 以自己的左上角为原点(0, 0)
  • 它的x、y取值范围都是0~1,默认值为(0.5, 0.5) 

设置position 是让layer的中心跑到position的位置上  默认

anchorPoint 是将这个锚点的位置放在position 上

@interface ViewController ()
@property (nonatomic, weak) CALayer* second;
@end
@implementation ViewController
- (void)viewDidLoad{[super viewDidLoad];// Do any additional setup after loading the view, typically from a nib.// 创建表盘CALayer* clock = [[CALayer alloc] init];clock.bounds = CGRectMake(0, 0, 200, 200); // 大小clock.position = CGPointMake(200, 200); // 位置// 设置图片clock.contents = (__bridge id)[UIImage imageNamed:@"clock"].CGImage;// 设置圆角clock.cornerRadius = 100;clock.masksToBounds = YES;// 创建秒针CALayer* second = [[CALayer alloc] init];second.bounds = CGRectMake(0, 0, 2, 100); // 大小second.position = clock.position; // 位置second.backgroundColor = [UIColor redColor].CGColor; // 颜色// 锚点 定位点second.anchorPoint = CGPointMake(0.5, 0.8);// 添加表盘[self.view.layer addSublayer:clock];// 添加秒针[self.view.layer addSublayer:second];// 给全局属性赋值self.second = second;// 计时器[NSTimer scheduledTimerWithTimeInterval:1 target:self selector:@selector(timeChange) userInfo:nil repeats:YES];[self timeChange];
}
// 旋转(一秒一次)
- (void)timeChange{// 一秒钟旋转的角度CGFloat angle = 2 * M_PI / 60;NSDate* date = [NSDate date];// 真实的时间// 15:00:20 000// 15:00:20 999//    // 1.nsdate//    // 创建一个时间格式化的对象//    NSDateFormatter* formatter = [[NSDateFormatter alloc] init];//    formatter.dateFormat = @"ss";//    CGFloat time = [[formatter stringFromDate:date] floatValue];// 2.日历NSCalendar* cal = [NSCalendar currentCalendar];CGFloat time = [cal component:NSCalendarUnitSecond fromDate:date];self.second.affineTransform = CGAffineTransformMakeRotation(time * angle);
}
@end

 


http://www.ngui.cc/el/3419345.html

相关文章

ios基础篇(十.一)—— 动画

CADisplayLink CADisplayLink是一种以屏幕刷新频率触发的时钟机制&#xff0c;每秒钟执行大约60次左右 CADisplayLink是一个计时器&#xff0c;可以使绘图代码与视图的刷新频率保持同步&#xff0c;而NSTimer无法确保计时器实际被触发的准确时间 使用方法&#xff1a; 定义…

ios基础篇(十一)—— 同步/异步、进程/线程、pthread、线程状态、线程同步、自动释放池

多线程 一、同步/异步 1、1同步 我们之前写程序的时候都是从上到下,从左到右,代码执行顺序1个人执行多个任务,也是依次执行&#xff0c;1个人同一时间执行1个任务 1.2异步 多个人可以同时执行多个任务 二、进程/线程 2.1进程 进程是指在系统中正在运行的一个应用程序每个…

ios基础篇(十二)—— 消息循环、GCD、任务和队列、串行、并行、Barrier阻塞、延时操作、一次性执行

一、消息循环 什么是消息循环 Runloop就是消息循环&#xff0c;每一个线程内部都有一个消息循环只有主线程的消息循环默认开启&#xff0c;子线程的消息循环默认不开启消息循环的目的 保证程序不退出负责处理输入事件如果没有事件发生&#xff0c;会让程序进入休眠状态 1.1 消…

ios基础篇(十三)—— 调度组、NSOperationQueue

一、调度组 有时候需要在多个异步任务都执行完成之后继续做某些事情&#xff0c;比如下载歌曲&#xff0c;等所有的歌曲都下载完毕之后 转到 主线程提示用户 //1 全局队列dispatch_queue_t queue dispatch_get_global_queue(0, 0);//2 调度组dispatch_group_t group dispatc…

ios基础篇(十五)—— SDWebImage

一、SDWebImage介绍 什么是SDWebImage iOS中著名的牛逼的网络图片处理框架包含的功能&#xff1a;图片下载、图片缓存、下载进度监听、gif处理等等用法极其简单&#xff0c;功能十分强大&#xff0c;大大提高了网络图片的处理效率国内超过90%的iOS项目都有它的影子项目地址 ht…

ios基础篇(十六)—— 网络之sockct

一、网络基本概念 客户端&#xff1a;应用 C/S B/S服务器&#xff1a;为客户端提供服务、数据、资源的机器请求&#xff1a;客户端向服务器索取数据响应&#xff1a;服务器对客户端的请求作出反应&#xff0c;一般是返回给客户端数据服务器 内网服务器外网服务器本地测试服…

时序图

一、时序图简介&#xff08;Brief introduction&#xff09; 时序图&#xff08;Sequence Diagram&#xff09;是显示对象之间交互的图&#xff0c;这些对象是按时间顺序排列的。 顺序图中显示的是参与交互的对象及其对象之间消息交互的顺序。 时序图中包括的建模元素主要有&a…

《Objective-C高级编程:iOS与OS X多线程和内存管理》 一 自动引用计数

一、自动引用计数 1.1 内存管理的思考方式 对象操作与objective-c 方法的对应对象操作Object-C 方法生成并持有对象alloc、new、copy、mutableCopy持有对象retain方法释放对象release方法废弃对象dealloc方法1.1.1 自己生成的对象&#xff0c;自己持有 使用以下名称开头的方…

《Objective-C高级编程:iOS与OS X多线程和内存管理》 一 Blocks模式GCD

一、Blocks摘要 Blocks&#xff1a;带有自动变量&#xff08;局部变量&#xff09;的匿名函数。 匿名函数&#xff1a;不带有名称的函数。 int func(int cout); //声明名称为func的函数 int result func(10); // 调用该函数&#xff0c;必须使用该函数的名称 // 若像下面这…

JXCategoryTitleView的使用

最近写项目&#xff0c;遇到了一个vc下面有多个vc 指示器可以点击切换&#xff0c;也可也左右滑动进行切换&#xff0c;解除了JXCategoryTitleView 感觉很好用&#xff1b; 一般要求主vc遵循JXCategoryViewDelegate、JXCategoryListContainerViewDelegate两个协议 子vc遵循JX…