iOS动画的几种实现方式:
2018-07-11 本文已影响0人
全栈的猫南北
一、CABasicAnimation基本动画(fromValue和toValue)
CABasicAnimation *animation = [CABasicAnimation new];
// 设置动画要改变的属性
animation.keyPath = @"transform.rotation.z";
//animation.fromValue = @(_bgImgV.layer.transform.m11);
// 动画的最终属性的值(转7.5圈)
animation.toValue = @(M_PI*2);
// 动画的播放时间
animation.duration = 60;
animation.repeatCount =LONG_MAX;
// 动画效果同速度
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
// 解决动画结束后回到原始状态的问题
animation.removedOnCompletion = NO;
animation.fillMode = kCAFillModeForwards;
animation.delegate = self;
// 将动画添加到视图bgImgV的layer上
[romate.layer addAnimation:animation forKey:@"rotation"];
1485148932685541.png
二、CAKeyframeAnimation关键帧动画:
1、关键帧动画之path路径
//#pragma mark - 沿着路径运动!
- (void)demoPath{
// 1.创建动画
CAKeyframeAnimation *anim = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"];
// 2.设置路径
anim.path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(10, 50, KSCREEN_WIDTH-20, KSCREEN_WIDTH)].CGPath;
anim.repeatCount = CGFLOAT_MAX;
// 沿着路径运动,修改了时长,做完运动会停一下!又接着走!
anim.duration = 200;
// 计算模式 -> 强制运动,匀速进行,不管路径有多远!
anim.calculationMode = kCAAnimationPaced;
// 旋转模式 -> 沿着路径,自行旋转 转的时候需要沿着路径的切线!进行转动!
anim.rotationMode = kCAAnimationRotateAuto;
// 3.添加
[_romate.layer addAnimation:anim forKey:nil];
}
2、关键帧动画之values("之"字形动画)
CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
//设置value
NSValue *value1=[NSValue valueWithCGPoint:CGPointMake(100, 100)];
NSValue *value2=[NSValue valueWithCGPoint:CGPointMake(200, 200)];
NSValue *value3=[NSValue valueWithCGPoint:CGPointMake(100, 300)];
NSValue *value4=[NSValue valueWithCGPoint:CGPointMake(200, 400)];
animation.values=@[value1,value2,value3,value4];
//重复次数 默认为1
animation.repeatCount=MAXFLOAT;
//设置是否原路返回默认为不
animation.autoreverses = YES;
//设置移动速度,越小越快
animation.duration = 4.0f;
animation.removedOnCompletion = NO;
animation.fillMode = kCAFillModeForwards;
animation.timingFunction=[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
animation.delegate=self;
//给这个view加上动画效果
[moveView.layer addAnimation:animation forKey:nil];
1485149812874038.png
三、UIView 代码块调用:
1、layer的CATransform3DIdentity;
romate.layer.transform = CATransform3DIdentity;
[UIView animateWithDuration:20
delay:0
options:UIViewAnimationOptionAllowUserInteraction|
UIViewAnimationOptionCurveLinear
animations:^{
romate.layer.transform = CATransform3DMakeRotation(M_PI/4, 0, 0, 1);
}
completion:NULL
];
2、view的CGAffineTransformIdentity;
romate.transform = CGAffineTransformIdentity;
[UIView animateWithDuration:100
delay:0
options:UIViewAnimationOptionAllowUserInteraction|
UIViewAnimationOptionCurveLinear
animations:^{
romate.transform = CGAffineTransformMakeRotation(M_PI);
}
completion:NULL
];