CALyer简单介绍和使用
一、position和anchorPoint
1.简单介绍
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）
二、了解一下CALayer的基本常用的属性：
UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
button.frame = CGRectMake(100, 50, 175, 175);
[button setBackgroundImage:[UIImage imageNamed:@"06.jpg"] forState:UIControlStateNormal];
[self.view addSubview:button];
button.layer.cornerRadius = 20 ;
button.layer.borderColor = [[UIColor yellowColor]CGColor];
button.layer.borderWidth = 2 ;
// button.clipsToBounds = YES ;
//阴影颜色
button.layer.shadowColor = [[UIColor blackColor]CGColor];
//阴影的偏移距离
button.layer.shadowOffset = CGSizeMake(20, 20);
//阴影的透明度
button.layer.shadowOpacity = 0.8 ;
//阴影
button.layer.shadowRadius = 20 ;
//是否裁剪边框之外的
// button.layer.masksToBounds = YES ;
//CALayer负责视图的渲染 UI中真正负责绘图的部分 没有用户交互，仅仅是展示视图内容，一般用来做动画
CALayer *layer = [CALayer layer];
layer.frame = CGRectMake(100, 300, 175, 175);
layer.backgroundColor = [[UIColor yellowColor]CGColor];
layer.contents = (id)[[UIImage imageNamed:@"06.jpg"]CGImage];
[self.view.layer addSublayer:layer];
layer.shadowOffset = CGSizeMake(20, 20);
layer.shadowColor = [[UIColor redColor]CGColor];
layer.shadowOpacity = 0.3 ;
三、接下来我们写个Demo来演示一下
/*
每一个UIView内部都默认关联着一个CALayer，我们可用称这个Layer为Root Layer（根层）
所有的非Root Layer，也就是手动创建的CALayer对象，都存在着隐式动画
什么是隐式动画？
当对非Root Layer的部分属性进行修改时，默认会自动产生一些动画效果
而这些属性称为Animatable Properties(可动画属性)
列举几个常见的Animatable Properties：
bounds：用于设置CALayer的宽度和高度。修改这个属性会产生缩放动画
backgroundColor：用于设置CALayer的背景色。修改这个属性会产生背景色的渐变动画
position：用于设置CALayer的位置。修改这个属性会产生平移动画
*/
@interface ViewController ()
@property (nonatomic,retain) CALayer *layer ;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
self.layer = [CALayer layer];
self.layer.bounds = CGRectMake(0, 0, 100, 100);
//设置锚点
self.layer.position = CGPointMake(187.5, 200);
//设置锚点在layer上的比例
self.layer.anchorPoint = CGPointMake(0.2, 0.2) ;
self.layer.cornerRadius = 20 ;
self.layer.borderWidth = 2 ;
self.layer.shadowOffset = CGSizeMake(20, 20);
self.layer.shadowOpacity = 0.2 ;
self.layer.doubleSided = YES ;
self.layer.borderColor = [[UIColor redColor]CGColor];
self.layer.backgroundColor = [[UIColor brownColor]CGColor];
[self.view.layer addSublayer:self.layer];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
#pragma mark -- 平移CALayer
- (IBAction)buttonAction1:(UIButton *)sender {
//创建一个基本动画对象
CABasicAnimation *animation = [CABasicAnimation animation];
//动画的类型
//keyPath layer的某个属性
animation.keyPath = @"position";
//动画的持续时间
animation.duration = 2 ;
//toValue 就是一个临时值,通过CALayer做的动画不会改变layer属性本身的值
animation.toValue = [NSValue valueWithCGPoint:CGPointMake(100, 400)];
//如果要保留动画的最终目的，下面两个属性分都需要设置
//保持动画的最新状态
animation.fillMode = kCAFillModeBackwards ;
//设置动画完成后之后不删除
animation.removedOnCompletion = NO ;
animation.delegate = self ;
[self.layer addAnimation:animation forKey:nil];
}
-(void)animationDidStart:(CAAnimation *)anim
{
NSLog(@"%@",NSStringFromCGRect(self.layer.bounds));
}
#pragma mark --实现缩放
- (IBAction)buttonAction2:(UIButton *)sender {
//1.创建一个基本动画
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"bounds"];
//2.设置动画持续时间
animation.duration = 2 ;
//3.设置动画的最终效果
animation.toValue = [NSValue valueWithCGRect:CGRectMake(0, 0, 200, 200)];
//4.使动画保留最终状态
animation.fillMode = kCAFillModeForwards ;
animation.removedOnCompletion = NO ;
//5.将动画对象付给layer
[self.layer addAnimation:animation forKey:nil];
}
- (IBAction)buttonAction3:(UIButton *)sender {
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
animation.duration = 2 ;
animation.fillMode = kCAFillModeForwards ;
animation.removedOnCompletion = NO ;
animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI / 3, 0, 0, 1)];
[self.layer addAnimation:animation forKey:nil];
}
@end