【iOS開發(fā)】30多個iOS常用動畫,帶詳細注釋 (2014-04-20 14:55:54)轉載▼
標簽: ios開發(fā) 動畫 it 分類: Xcode/iOS/MacOS
30多個iOS常用動畫,帶詳細注釋
//
// CoreAnimationEffect.h
// CoreAnimationEffect
//
// Created by VincentXue on 13-1-19.
// Copyright (c) 2013年 VincentXue. All rights reserved.
//
import
@interface CoreAnimationEffect : NSObject
pragma mark - Custom Animation
(void)showAnimationType:(NSString *)type withSubType:(NSString *)subType duration:(CFTimeInterval)duration timingFunction:(NSString *)timingFunction view:(UIView *)theView;
pragma mark - Preset Animation
// reveal
- (void)animationRevealFromBottom:(UIView *)view;
- (void)animationRevealFromTop:(UIView *)view;
- (void)animationRevealFromLeft:(UIView *)view;
- (void)animationRevealFromRight:(UIView *)view;
// 漸隱漸消
- (void)animationEaseIn:(UIView *)view;
- (void)animationEaseOut:(UIView *)view;
// 翻轉
- (void)animationFlipFromLeft:(UIView *)view;
- (void)animationFlipFromRigh:(UIView *)view;
// 翻頁
- (void)animationCurlUp:(UIView *)view;
- (void)animationCurlDown:(UIView *)view;
// push
- (void)animationPushUp:(UIView *)view;
- (void)animationPushDown:(UIView *)view;
- (void)animationPushLeft:(UIView *)view;
- (void)animationPushRight:(UIView *)view;
// move
- (void)animationMoveUp:(UIView *)view duration:(CFTimeInterval)duration;
- (void)animationMoveDown:(UIView *)view duration:(CFTimeInterval)duration;
- (void)animationMoveLeft:(UIView *)view;
- (void)animationMoveRight:(UIView *)view;
// 旋轉縮放
// 各種旋轉縮放效果
- (void)animationRotateAndScaleEffects:(UIView *)view;
// 旋轉同時縮小放大效果
- (void)animationRotateAndScaleDownUp:(UIView *)view;
pragma mark - Private API
(void)animationFlipFromTop:(UIView *)view;
(void)animationFlipFromBottom:(UIView *)view;
(void)animationCubeFromLeft:(UIView *)view;
(void)animationCubeFromRight:(UIView *)view;
(void)animationCubeFromTop:(UIView *)view;
(void)animationCubeFromBottom:(UIView *)view;
(void)animationSuckEffect:(UIView *)view;
(void)animationRippleEffect:(UIView *)view;
(void)animationCameraOpen:(UIView *)view;
(void)animationCameraClose:(UIView *)view;
@end
//
// CoreAnimationEffect.m
// CoreAnimationEffect
//
// Created by VincentXue on 13-1-19.
// Copyright (c) 2013年 VincentXue. All rights reserved.
//
import "CoreAnimationEffect.h"
import
@implementation CoreAnimationEffect
pragma mark - Custom Animation
(void)showAnimationType:(NSString )type
withSubType:(NSString *)subType
duration:(CFTimeInterval)duration
timingFunction:(NSString *)timingFunction
view:(UIView )theView
{
/ CATransition
@see http://www.dreamingwish.com/dream-2012/the-concept-of-coreanimation-programming-guide.html
@see http://geeklu.com/2012/09/animation-in-ios/ *
CATransition 常用設置及屬性注解如下: */
CATransition *animation = [CATransition animation];
animation.delegate = self;
animation.duration = duration;
animation.timingFunction = [CAMediaTimingFunction functionWithName:timingFunction];
animation.fillMode = kCAFillModeForwards;
// animation.removedOnCompletion = NO;
** type
- 各種動畫效果 其中除了'fade',
moveIn',
push' , `reveal' ,其他屬于私有的API(我是這么認為的,可以點進去看下注釋). - ↑↑↑上面四個可以分別使用'kCATransitionFade', 'kCATransitionMoveIn', 'kCATransitionPush', 'kCATransitionReveal'來調(diào)用.
- @"cube" 立方體翻滾效果
- @"moveIn" 新視圖移到舊視圖上面
- @"reveal" 顯露效果(將舊視圖移開,顯示下面的新視圖)
- @"fade" 交叉淡化過渡(不支持過渡方向) (默認為此效果)
- @"pageCurl" 向上翻一頁
- @"pageUnCurl" 向下翻一頁
- @"suckEffect" 收縮效果,類似系統(tǒng)最小化窗口時的神奇效果(不支持過渡方向)
- @"rippleEffect" 滴水效果,(不支持過渡方向)
- @"oglFlip" 上下左右翻轉效果
- @"rotate" 旋轉效果
- @"push"
- @"cameraIrisHollowOpen" 相機鏡頭打開效果(不支持過渡方向)
- @"cameraIrisHollowClose" 相機鏡頭關上效果(不支持過渡方向)
** type
- kCATransitionFade 交叉淡化過渡
- kCATransitionMoveIn 新視圖移到舊視圖上面
- kCATransitionPush 新視圖把舊視圖推出去
- kCATransitionReveal 將舊視圖移開,顯示下面的新視圖
*/
animation.type = type;
** subtype
- 各種動畫方向
- kCATransitionFromRight; 同字面意思(下同)
- kCATransitionFromLeft;
- kCATransitionFromTop;
- kCATransitionFromBottom;
** subtype
- 當type為@"rotate"(旋轉)的時候,它也有幾個對應的subtype,分別為:
- 90cw 逆時針旋轉90°
- 90ccw 順時針旋轉90°
- 180cw 逆時針旋轉180°
- 180ccw 順時針旋轉180°
**
- type與subtype的對應關系(必看),如果對應錯誤,動畫不會顯現(xiàn).
- @see http://iphonedevwiki.net/index.php/CATransition
animation.subtype = subType;
**
- 所有核心動畫和特效都是基于CAAnimation,而CAAnimation是作用于CALayer的.所以把動畫添加到layer上.
- forKey 可以是任意字符串.
[theView.layer addAnimation:animation forKey:nil];
}
pragma mark - Preset Animation
(void)animationRevealFromBottom:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setType:kCATransitionReveal];
[animation setSubtype:kCATransitionFromBottom];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationRevealFromTop:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setType:kCATransitionReveal];
[animation setSubtype:kCATransitionFromTop];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationRevealFromLeft:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setType:kCATransitionReveal];
[animation setSubtype:kCATransitionFromLeft];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationRevealFromRight:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setType:kCATransitionReveal];
[animation setSubtype:kCATransitionFromRight];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationEaseIn:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setType:kCATransitionFade];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn]];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationEaseOut:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setType:kCATransitionFade];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationFlipFromLeft:(UIView *)view
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:0.35f];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:view cache:NO];
[UIView commitAnimations];
}
(void)animationFlipFromRigh:(UIView *)view
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
[UIView setAnimationDuration:0.35f];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:view cache:NO];
[UIView commitAnimations];
}
(void)animationCurlUp:(UIView *)view
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
[UIView setAnimationDuration:0.35f];
[UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:view cache:NO];
[UIView commitAnimations];
}
(void)animationCurlDown:(UIView *)view
{
[UIView beginAnimations:nil context:NULL];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
[UIView setAnimationDuration:0.35f];
[UIView setAnimationTransition:UIViewAnimationTransitionCurlDown forView:view cache:NO];
[UIView commitAnimations];
}
(void)animationPushUp:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromTop];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationPushDown:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromBottom];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationPushLeft:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromLeft];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationPushRight:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:kCATransitionPush];
[animation setSubtype:kCATransitionFromRight];
[view.layer addAnimation:animation forKey:nil];
}
// presentModalViewController
- (void)animationMoveUp:(UIView *)view duration:(CFTimeInterval)duration
{
CATransition *animation = [CATransition animation];
[animation setDuration:duration];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[animation setType:kCATransitionMoveIn];
[animation setSubtype:kCATransitionFromTop];
1
[view.layer addAnimation:animation forKey:nil];
}
// dissModalViewController
- (void)animationMoveDown:(UIView *)view duration:(CFTimeInterval)duration
{
CATransition *transition = [CATransition animation];
transition.duration =0.4;
transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
transition.type = kCATransitionReveal;
transition.subtype = kCATransitionFromBottom;
[view.layer addAnimation:transition forKey:nil];
}
(void)animationMoveLeft:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:kCATransitionMoveIn];
[animation setSubtype:kCATransitionFromLeft];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationMoveRight:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:kCATransitionMoveIn];
[animation setSubtype:kCATransitionFromRight];
[view.layer addAnimation:animation forKey:nil];
}
+(void)animationRotateAndScaleEffects:(UIView )view
{
[UIView animateWithDuration:0.35f animations:^
{
/*
- @see http://donbe.blog.163.com/blog/static/138048021201061054243442/
- @param transform 形變屬性(結構體),可以利用這個屬性去對view做一些翻轉或者縮放.詳解請猛戳↑URL.
- @method valueWithCATransform3D: 此方法需要一個CATransform3D的結構體.一些非詳細的講解可以看下面的URL
- @see http://blog.csdn.net/liubo0_0/article/details/7452166
*/
animation.type = type;
animation.subtype = subType;
[theView.layer addAnimation:animation forKey:nil];
}
(void)animationRotateAndScaleDownUp:(UIView *)view
{
CABasicAnimation *rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"];
rotationAnimation.toValue = [NSNumber numberWithFloat:(2 * M_PI) * 2];
rotationAnimation.duration = 0.35f;
rotationAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
CABasicAnimation *scaleAnimation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
scaleAnimation.toValue = [NSNumber numberWithFloat:0.0];
scaleAnimation.duration = 0.35f;
scaleAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
CAAnimationGroup *animationGroup = [CAAnimationGroup animation];
animationGroup.duration = 0.35f;
animationGroup.autoreverses = YES;
animationGroup.repeatCount = 1;
animationGroup.animations =[NSArray arrayWithObjects:rotationAnimation, scaleAnimation, nil];
[view.layer addAnimation:animationGroup forKey:@"animationGroup"];
}
pragma mark - Private API
(void)animationFlipFromTop:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"oglFlip"];
[animation setSubtype:@"fromTop"];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationFlipFromBottom:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"oglFlip"];
[animation setSubtype:@"fromBottom"];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationCubeFromLeft:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"cube"];
[animation setSubtype:@"fromLeft"];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationCubeFromRight:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"cube"];
[animation setSubtype:@"fromRight"];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationCubeFromTop:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"cube"];
[animation setSubtype:@"fromTop"];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationCubeFromBottom:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"cube"];
[animation setSubtype:@"fromBottom"];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationSuckEffect:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"suckEffect"];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationRippleEffect:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"rippleEffect"];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationCameraOpen:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"cameraIrisHollowOpen"];
[animation setSubtype:@"fromRight"];
[view.layer addAnimation:animation forKey:nil];
}
(void)animationCameraClose:(UIView *)view
{
CATransition *animation = [CATransition animation];
[animation setDuration:0.35f];
[animation setFillMode:kCAFillModeForwards];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]];
[animation setType:@"cameraIrisHollowClose"];
[animation setSubtype:@"fromRight"];
[view.layer addAnimation:animation forKey:nil];
}
@end