前言：
心跳效果就让一张图片做一个放大缩放小的动画。
抖动效果就是做一个左右旋转的动画.先让它往左边旋转-X°,再往右边旋转X°度,再从X°度旋转到-X°。就会有左右摇摆的效果了。
转场动画就是从旧视图转入新视图的动画效果。
1.心跳效果
代码实现
- (void)heartAnimation{
CABasicAnimation *anima = [CABasicAnimation animation];
anima.keyPath = @"transform.scale";
anima.toValue = @0.5;
anima.repeatCount = MAXFLOAT;
anima.duration = 0.3;
anima.autoreverses = YES;
[self.clockView.layer addAnimation:anima forKey:nil];
}
实现效果
心跳.gif
2.抖动效果
代码实现
//#define angleValue(angle) ((angle) * M_PI / 180.0)//角度数值转换宏
- (void)imgaeShake{
CAKeyframeAnimation *anima = [CAKeyframeAnimation animation];
anima.keyPath = @"transform.rotation";
anima.values = @[@(angleValue(-5)),@(angleValue(5)),@(angleValue(-5))];
anima.repeatCount = MAXFLOAT;
[self.clockView.layer addAnimation:anima forKey:nil];
}
实现效果
抖动.gif
3.转场动画
实现多张图片的切换效果，图片名字为1.png、2.png、3.png。
代码实现
static int name = 1;
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
name++;
if (name == 4) {
name = 1;
}
NSString *imgName = [NSString stringWithFormat:@"%d",name];
self.tranImgView.image = [UIImage imageNamed:imgName];
CATransition *anima = [CATransition animation];
anima.duration = 1.0;
/** 动画效果有:
@"fade":交叉淡化过渡
@"push":推动效果
@"moveIn":移动效果
@"cube":立体翻滚
@"oglFlip":上下左右翻滚
@"suckEffect":收缩效果，被抽走
@"rippleEffect":水滴效果
@"pageCurl":向上翻页
@"pageUnCurl":向下翻页
@"cameraIrisHollowOpen":相机镜头打开效果
@"cameraIrisHollowClose":相机镜头关闭效果
*/
anima.type = @"cube";
// //设置动画的起始位置
// anim.startProgress = 0.3;
// //设置动画的结束位置
// anim.endProgress = 0.5;
[self.tranImgView.layer addAnimation:anima forKey:nil];
}
实现效果
立体翻滚效果.gif
翻页效果.gif
