关于IOS 动画的实现
首先IOS里面有许多自己自带的动画 比如present push 一个界面都会有动画,在项目开发中我们常用的动画一般是以下:
[UIViewanimateWithDuration:0.5animations:^{
// 执行的动画比如空间的坐标颜色变化
} completion:^(BOOL finished) {
// 完成之后 需要处理的
}];
或者用空间的属性transform 来做动画button.transform= CGAffineTransformMakeRotation();
CGAffineTransformMakeScale(, );
或者对于 UIScrollView 滑动的时候 根据其代理函数
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
CGFloat moveSpace=scrollView.contentOffset.x;
// 根据 scrollView的位移改变某些控件的颜色左边透明度
}
// 值得注意的是这个函数是按照某个小时间段执行的是隔一段时间执行一次这意味着如果滑动过快会出现一些不自然地地方但是也可以弥补的
然后接下来就说一下IOS的核心动画。
所有的核心动画都是继承于CAAnimation,还有其它的继承关系如下:
@interface CAPropertyAnimation : CAAnimation
@interface CABasicAnimation : CAPropertyAnimation
@interface CAKeyframeAnimation : CAPropertyAnimation
@interface CASpringAnimation : CABasicAnimation
@interface CATransition : CAAnimation
@interface CAAnimationGroup : CAAnimation
总共是 CAAnimation CAPropertyAnimation CABasicAnimation CAKeyframeAnimation CASpringAnimation CATransition CAAnimationGroup 八个类。
(1)能用的动画类只有4个子类:CABasicAnimation、CAKeyframeAnimation、CATransition、CAAnimationGroup
(2)CAMediaTiming是一个协议(protocol)。
CABasicAnimation* fadeAnim = [CABasicAnimationanimationWithKeyPath:@"opacity"];
fadeAnim.fromValue = [NSNumbernumberWithFloat:1.0];
fadeAnim.toValue = [NSNumbernumberWithFloat:0.0];
fadeAnim.duration = 1.0;
[theLayer addAnimation:fadeAnim forKey:@"opacity"];
// Change the actual data value in the layer to the final value.
theLayer.opacity = 0.0;
其中的KeyPath是CALayer里面的各种属性。
CAKeyframeAnimation应用如下:
CGMutablePathRef thePath =CGPathCreateMutable();
CGPathMoveToPoint(thePath,NULL,74.0,74.0);
CGPathAddCurveToPoint(thePath,NULL,74.0,500.0,
320.0,500.0,
320.0,74.0);
CGPathAddCurveToPoint(thePath,NULL,320.0,500.0,
566.0,500.0,
566.0,74.0);
CAKeyframeAnimation * theAnimation;
// Create the animation object, specifying the position property as the key path.
theAnimation=[CAKeyframeAnimation animationWithKeyPath:@"position"];
// theAnimation.values=@[[NSValue valueWithCGPoint:CGPointMake(0, 100)],[NSValue valueWithCGPoint:CGPointMake(0, 200)],[NSValue valueWithCGPoint:CGPointMake(0, 300)]];
// 或者
// theAnimation.path=thePath;
theAnimation.duration=5.0;
//keyTimes 这个属性的取值范围是0~1
// Add the animation to the layer.
[button.layer addAnimation:theAnimation forKey:@"position"];
CAKeyframeAnimation* widthAnim = [CAKeyframeAnimationanimationWithKeyPath:@"borderWidth"];
NSArray* widthValues = [NSArrayarrayWithObjects:@1.0,@10.0,@5.0,@30.0,@0.5,@15.0,@2.0,@50.0,@0.0,nil];
widthAnim.values = widthValues;
widthAnim.calculationMode =kCAAnimationPaced;
// Animation 2
CAKeyframeAnimation* colorAnim = [CAKeyframeAnimationanimationWithKeyPath:@"borderColor"];
NSArray* colorValues = [NSArrayarrayWithObjects:(id)[UIColorgreenColor].CGColor,
(id)[UIColorredColor].CGColor, (id)[UIColorblueColor].CGColor, nil];
colorAnim.values = colorValues;
colorAnim.calculationMode =kCAAnimationPaced;
// Animation group
CAAnimationGroup* group = [CAAnimationGroupanimation];
group.animations = [NSArrayarrayWithObjects:colorAnim, widthAnim,nil];
group.duration = 5.0;
[button.layer addAnimation:group forKey:@"BorderChanges"];
CATransition是 CAAnimation的子类,用于做转场动画,能够为层提供移出屏幕和移入屏幕的动画效果。iOS比Mac OS X的转场动画效果少一点.
UINavigationController就是通过CATransition实现了将控制器的视图推入屏幕的动画效果.
属性解析:
type:动画过渡类型
subtype:动画过渡方向
startProgress:动画起点(在整体动画的百分比)
endProgress:动画终点(在整体动画的百分比)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
|
/* 过渡效果
fade //交叉淡化过渡(不支持过渡方向) kCATransitionFade
push //新视图把旧视图推出去 kCATransitionPush
moveIn //新视图移到旧视图上面 kCATransitionMoveIn
reveal //将旧视图移开,显示下面的新视图 kCATransitionReveal
cube //立方体翻滚效果
oglFlip //上下左右翻转效果
suckEffect //收缩效果,如一块布被抽走(不支持过渡方向)
rippleEffect //滴水效果(不支持过渡方向)
pageCurl //向上翻页效果
pageUnCurl //向下翻页效果
cameraIrisHollowOpen //相机镜头打开效果(不支持过渡方向)
cameraIrisHollowClose //相机镜头关上效果(不支持过渡方向)
*/
/* 过渡方向
kCATransitionFromRight
kCATransitionFromLeft
kCATransitionFromBottom
kCATransitionFromTop
*/
// CATransition的使用
CATransition *anim = [CATransition animation];
anim.type = @
"cube"
;
// 动画过渡类型
anim.subtype = kCATransitionFromTop;
// 动画过渡方向
anim.duration = 1;
// 动画持续1s
// 代理,动画执行完毕后会调用delegate的animationDidStop:finished:
anim.delegate = self;
|