iOS 动画初步

1. CALayer的使用 (图层) 属于QuartzCore.framework 框架 跨平台

我们在开发中使用的UIKit.framework里面的控件之所以可以看见，主要是由于他拥有了CALayer。

 1   //-------------------------------------------------------------------------
 2     // 图层 部分属性
 3
 4     // shadow 是否透明
 5     self.myView.layer.shadowOpacity = 1.0f;
 6
 7     // shadow 颜色
 8     self.myView.layer.shadowColor = [UIColor redColor].CGColor;
 9
10     // shadow 半径
11     self.myView.layer.shadowRadius = 10.0f;
12
13     // layer 的圆角半径
14     self.myView.layer.cornerRadius = 5;
15
16     // layer 边框颜色
17     _myView.layer.borderColor = [UIColor whiteColor].CGColor;
18
19     // layer 边框半径
20     _myView.layer.borderWidth = 10;
21     //-------------------------------------------------------------------------

CALayer在设置部分属性时，有动画效果，（隐试动画）有  Animatable 相关的注释便自带了隐试动画

如：

1 /* The shadow offset. Defaults to (0, -3). Animatable. */
2
3 @property CGSize shadowOffset;
4
5 /* The blur radius used to create the shadow. Defaults to 3. Animatable. */
6
7 @property CGFloat shadowRadius;

CALayer的使用

 1     CALayer *lay = [CALayer layer];
 2     lay.backgroundColor = [UIColor redColor].CGColor;
 3     lay.shadowOpacity = 1.0;
 4     lay.shadowColor = [UIColor whiteColor].CGColor;
 5     lay.shadowRadius = 10;
 6     lay.cornerRadius = 5;
 7     lay.masksToBounds = YES;
 8     [self.view.layer addSublayer:lay];
 9
10     // 设置image
11     lay.contents = (__bridge id _Nullable)([UIImage imageNamed:@"111"].CGImage);

CALayerd的动画 （使用CATransform3D，一般不用此方法做动画）

 1     // 旋转 rotation
 2     [UIView animateWithDuration:0.3 animations:^{
 3         _layer.transform = CATransform3DMakeRotation(M_PI_4, 0, 0, 0);
 4
 5         // KVC
 6         [_layer setValue:[NSValue valueWithCATransform3D:CATransform3DMakeRotation(M_PI_4, 0, 0, 0)] forKeyPath:@"transform"];
 7
 8         // KVC transform.rotation
 9         [_layer setValue:@M_PI forKeyPath:@"transform.rotation"];
10
11     }];
12
13     // 放大 缩小 Scale
14     [UIView animateWithDuration:0.3 animations:^{
15
16         _layer.transform = CATransform3DMakeScale(0, 0, 0);
17
18         // KVC
19         [_layer setValue:[NSValue valueWithCATransform3D:CATransform3DMakeScale(0, 0, 0)] forKeyPath:@"transform"];
20     }];
21
22     // 平移 Translation
23     [UIView animateWithDuration:0.3 animations:^{
24
25         _layer.transform = CATransform3DMakeTranslation(0, 0, 0);
26
27         // KVC
28         [_layer setValue:[NSValue valueWithCATransform3D:CATransform3DMakeTranslation(0, 0, 0)] forKeyPath:@"transform"];
29
30         [_layer setValue:[NSValue valueWithCATransform3D:CATransform3DMakeTranslation(0, 0, 0)] forKeyPath:@"transform.x"];
31
32     }];
33
34     // ... CATransform3DMakeAffineTransform
35     [UIView animateWithDuration:0.3 animations:^{
36
37         _layer.transform = CATransform3DMakeAffineTransform(CGAffineTransformMake(0, 0, 0, 0, 0, 0));
38
39         // KVC
40         [_layer setValue:[NSValue valueWithCATransform3D:CATransform3DMakeAffineTransform(CGAffineTransformMake(0, 0, 0, 0, 0, 0))] forKeyPath:@"transform"];
41     }];