6> CoreAnimation
- Core Animation是直接作用在CALayer上的,并非UIView弦讽。
Core Animation忙芒,中文翻譯為核心動畫,它是一組非常強(qiáng)大的動畫處理API供屉,使用它能做出非常炫麗的動畫效果行冰,而且往往是事半功倍。也就是說伶丐,使用少量的代碼就可以實(shí)現(xiàn)非常強(qiáng)大的功能悼做。
Core Animation可以用在Mac OS X和iOS平臺。
Core Animation的動畫執(zhí)行過程都是在后臺操作的撵割,不會阻塞主線程贿堰。
要注意的是,Core Animation是直接作用在CALayer上的啡彬,并非UIView羹与。 - Core Animation結(jié)構(gòu)
- Core Animation 使用步驟
如果不是xcode5之后的版本,使用它需要先添加QuartzCore.framework和引入對應(yīng)的框架<QuartzCore/QuartzCore.h>
開發(fā)步驟:
1.首先得有CALayer
2.初始化一個(gè)CAAnimation對象庶灿,并設(shè)置一些動畫相關(guān)屬性
3.通過調(diào)用CALayer的addAnimation:forKey:方法纵搁,增加CAAnimation對象到CALayer中,這樣就能開始執(zhí)行動畫了
4.通過調(diào)用CALayer的removeAnimationForKey:方法可以停止CALayer中的動畫 - 創(chuàng)建CALayer
- touchBegin,點(diǎn)擊屏幕往踢,做動畫
- 創(chuàng)建動畫腾誉,添加動畫到CALayer
- 怎樣執(zhí)行動畫?執(zhí)行動畫的本質(zhì)是改變圖層的屬性。
- 告訴動畫執(zhí)行怎樣的動畫?設(shè)置動畫屬性(position)
- 告訴動畫屬性怎么改變?設(shè)置動畫屬性值改變 toValue fromValue
- duration:動畫時(shí)長
- 動畫有反彈?取消反彈
1> 執(zhí)行動畫完畢不要移除
2> 設(shè)置動畫填充模式利职,保持最新的位置趣效。 - rotation:
三維旋轉(zhuǎn):transform
二維旋轉(zhuǎn):transform.rotation - scale
- 設(shè)置圖層內(nèi)容(心)
- tovalue:@0.5
//創(chuàng)建動畫對象
CABasicAnimation *anim = [CABasicAnimation animation];
//設(shè)置屬性值.
anim.keyPath = @"transform.rotation";
anim.toValue = @(M_PI);
//動畫完成時(shí)會自動的刪除動畫.
//動畫完成時(shí)要不要?jiǎng)h除動畫
anim.removedOnCompletion = NO;
//讓動畫始終保存最前面的效果.
anim.fillMode = @"forwards"
//添加動畫
[self.redView.layer addAnimation:anim forKey:nil];
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
//添加動畫
CABasicAnimation *anim = [CABasicAnimation animation];
//設(shè)置屬性值.
anim.keyPath = @"transform.scale";
anim.toValue = @0;
//想要?jiǎng)赢媹?zhí)行多次
anim.repeatCount = MAXFLOAT;
//設(shè)置動畫的執(zhí)行時(shí)長
anim.duration = 0.5;
//反轉(zhuǎn),怎么去的,怎么樣回來.
anim.autoreverses = YES;
//添加動畫
[self.imageV.layer addAnimation:anim forKey:nil];
}
//創(chuàng)建動畫對象
CABasicAnimation *anim = [CABasicAnimation animation];
//設(shè)置屬性值.
anim.keyPath = @"transform.rotation";
anim.toValue = @(M_PI);
//動畫完成時(shí)會自動的刪除動畫.
//動畫完成時(shí)要不要?jiǎng)h除動畫
anim.removedOnCompletion = NO;
//讓動畫始終保存最前面的效果.
anim.fillMode = @"forwards";
//添加動畫
[self.redView.layer addAnimation:anim forKey:nil];
* 總結(jié)CABasicAnimation只能在兩個(gè)值之間做動畫,怎么多個(gè)值做動畫猪贪,用CAKeyframeAnimation
7> CAKeyframeAnimation
- 面向view開發(fā)跷敬,拖一個(gè)view
- values:能多個(gè)值之間做動畫,按照順序做热押。
//添加抖動的動畫.
CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
//設(shè)置屬性值.
anim.keyPath = @"transform.rotation";
anim.values = @[@(angle2Rad(-5)),@(angle2Rad(5))];
anim.autoreverses = YES;
//動畫一直重復(fù)執(zhí)行.
anim.repeatCount = MAXFLOAT;
anim.duration = 0.5;
//添加動畫
[self.iconView.layer addAnimation:anim forKey:nil];
- path
//添加抖動的動畫.
CAKeyframeAnimation *anim = [CAKeyframeAnimation animation];
//設(shè)置屬性值.
anim.keyPath = @"position";
//根據(jù)路徑做動畫
// UIBezierPath *path = [UIBezierPath bezierPath];
// [path moveToPoint:CGPointMake(50, 50)];
// [path addLineToPoint:CGPointMake(200, 400)];
UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(50, 50, 300, 300)];
anim.path = path.CGPath;
// anim.autoreverses = YES;
//動畫一直重復(fù)執(zhí)行.
anim.repeatCount = MAXFLOAT;
anim.duration = 0.5;
//添加動畫
[self.iconView.layer addAnimation:anim forKey:nil];
- 動畫節(jié)奏(timingFunction)
8> * 圖標(biāo)抖動
- PPT分析,左邊旋轉(zhuǎn)右邊旋轉(zhuǎn) -> keyPath(transform.rotation) -> values -> 有點(diǎn)瘸 -> PPT分析 -> values添加一個(gè)值
9> * CATransition
過度動畫又叫轉(zhuǎn)場動畫 -> type(轉(zhuǎn)場類型) -> subtype(方向) -> 動畫進(jìn)度
注意:轉(zhuǎn)場動畫必須和過度代碼放在一塊西傀,否則沒有效果
static int _i = 1;
//轉(zhuǎn)場代碼必須得要和轉(zhuǎn)場動畫在同一個(gè)方法當(dāng)中.,并沒有要求他們的上下順序.
//轉(zhuǎn)場代碼.
_i++;
if (_i > 3) {
_i = 1;
}
NSString *imageName = [NSString stringWithFormat:@"%d",_i];
self.imageV.image = [UIImage imageNamed:imageName];
//添加轉(zhuǎn)場動畫
CATransition *anim = [CATransition animation];
anim.duration = 1;
//動畫從哪個(gè)點(diǎn)開始.
anim.startProgress = 0.3;
//動畫從哪個(gè)點(diǎn)結(jié)束.
anim.endProgress = 0.5;
//轉(zhuǎn)場類型.
anim.type = @"pageCurl";
[self.imageV.layer addAnimation:anim forKey:nil];
10> * CAAnimationGroup
同時(shí)進(jìn)行多種動畫 -> 平移,旋轉(zhuǎn)桶癣,縮放 -> 取消反彈
-(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{
CAAnimationGroup *animGroup = [CAAnimationGroup animation];
//animations數(shù)組當(dāng)中存入的都是animation對象
//平移
CABasicAnimation *anim = [CABasicAnimation animation];
anim.keyPath = @"position.y";
anim.toValue = @(400);
//縮放
CABasicAnimation *anim2 = [CABasicAnimation animation];
anim2.keyPath = @"transform.scale";
anim2.toValue = @(0.5);
//會自動執(zhí)行數(shù)組當(dāng)中所有的動畫對象.
animGroup.animations = @[anim,anim2];
//動畫完成不要?jiǎng)h除動畫
animGroup.removedOnCompletion = NO;
//始終保持最前面的效果
animGroup.fillMode = kCAFillModeForwards;
[self.redView.layer addAnimation:animGroup forKey:nil];
}
11> * UIView封裝的動畫
單視圖
+ (void)transitionWithView:(UIView *)view duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options animations:(void (^)(void))animations completion:(void (^)(BOOL finished))completion;
參數(shù)說明:
duration:動畫的持續(xù)時(shí)間
view:需要進(jìn)行轉(zhuǎn)場動畫的視圖
options:轉(zhuǎn)場動畫的類型
animations:將改變視圖屬性的代碼放在這個(gè)block中
completion:動畫結(jié)束后拥褂,會自動調(diào)用這個(gè)block
雙視圖
+ (void)transitionFromView:(UIView *)fromView toView:(UIView *)toView duration:(NSTimeInterval)duration options:(UIViewAnimationOptions)options completion:(void (^)(BOOL finished))completion;
參數(shù)說明:
duration:動畫的持續(xù)時(shí)間
options:轉(zhuǎn)場動畫的類型
animations:將改變視圖屬性的代碼放在這個(gè)block中
completion:動畫結(jié)束后,會自動調(diào)用這個(gè)block
* 什么時(shí)候用核心動畫牙寞,什么時(shí)候用UIView動畫
* 核心動畫的缺點(diǎn):都是假象饺鹃,不能真正改變圖層屬性的值
* 展示和真實(shí)的位置不同
* 如果改變位置就用UIView的動畫
* 轉(zhuǎn)場動畫就用核心動畫
* 為什么轉(zhuǎn)場用核心動畫?因?yàn)閁IView的轉(zhuǎn)場動畫太少碎税。
* 演示UIView的轉(zhuǎn)場動畫
* touchBegin,切換圖片