UIView動畫UIView Animation總結(jié) 原文地址
基本動畫
最常用的幾種方式
//duration動畫持續(xù)時間, animations想要完成動畫block, UIView動畫完成時的最終狀態(tài)
+ (void)animateWithDuration:(NSTimeInterval)duration
animations:(void (^)(void))animations
//completion 動畫完成block, BOOL finished 表示動畫是否完成
+ (void)animateWithDuration:(NSTimeInterval)duration
animations:(void (^)(void))animations
completion:(void (^ __nullable)(BOOL finished))completion
//delay 延遲執(zhí)行時間, options 動畫效果枚舉
+ (void)animateWithDuration:(NSTimeInterval)duration
delay:(NSTimeInterval)delay
options:(UIViewAnimationOptions)options
animations:(void (^)(void))animations
completion:(void (^ __nullable)(BOOL finished))completion
animations 修改View屬性的Block 下面是支持修改的屬性
@property frame
@property bounds
@property center
@property transform
@property alpha
@property backgroundColor
@property contentStretch
options動畫效果枚舉 相關(guān)
UIViewAnimationOptionLayoutSubviews //提交動畫的時候布局子控件春贸，表示子控件將和父控件一同動畫妇斤。
UIViewAnimationOptionAllowUserInteraction //動畫時允許用戶交流苫费，比如觸摸
UIViewAnimationOptionBeginFromCurrentState //從當(dāng)前狀態(tài)開始動畫
UIViewAnimationOptionRepeat //動畫無限重復(fù)
UIViewAnimationOptionAutoreverse //執(zhí)行動畫回路,前提是設(shè)置動畫無限重復(fù)
UIViewAnimationOptionOverrideInheritedDuration //忽略外層動畫嵌套的執(zhí)行時間
UIViewAnimationOptionOverrideInheritedCurve //忽略外層動畫嵌套的時間變化曲線
UIViewAnimationOptionAllowAnimatedContent //通過改變屬性和重繪實現(xiàn)動畫效果，如果key沒有提交動畫將使用快照
UIViewAnimationOptionShowHideTransitionViews //用顯隱的方式替代添加移除圖層的動畫效果
UIViewAnimationOptionOverrideInheritedOptions //忽略嵌套繼承的選項
時間函數(shù)曲線相關(guān)
UIViewAnimationOptionCurveEaseInOut //時間曲線函數(shù)黍析，由慢到快
UIViewAnimationOptionCurveEaseIn //時間曲線函數(shù)三妈，由慢到特別快
UIViewAnimationOptionCurveEaseOut //時間曲線函數(shù)，由快到慢
UIViewAnimationOptionCurveLinear //時間曲線函數(shù)熙掺，勻速
轉(zhuǎn)場動畫相關(guān)的
UIViewAnimationOptionTransitionNone //無轉(zhuǎn)場動畫
UIViewAnimationOptionTransitionFlipFromLeft //轉(zhuǎn)場從左翻轉(zhuǎn)
UIViewAnimationOptionTransitionFlipFromRight //轉(zhuǎn)場從右翻轉(zhuǎn)
UIViewAnimationOptionTransitionCurlUp //上卷轉(zhuǎn)場
UIViewAnimationOptionTransitionCurlDown //下卷轉(zhuǎn)場
UIViewAnimationOptionTransitionCrossDissolve //轉(zhuǎn)場交叉消失
UIViewAnimationOptionTransitionFlipFromTop //轉(zhuǎn)場從上翻轉(zhuǎn)
UIViewAnimationOptionTransitionFlipFromBottom //轉(zhuǎn)場從下翻轉(zhuǎn)
彈簧動畫
+ (void)animateWithDuration:(NSTimeInterval)duration
delay:(NSTimeInterval)delay
usingSpringWithDamping:(CGFloat)dampingRatio
initialSpringVelocity:(CGFloat)velocity
options:(UIViewAnimationOptions)options
animations:(void (^)(void))animations
completion:(void (^ __nullable)(BOOL finished))completion
dampingRatio 彈簧的阻尼 如果為1動畫則平穩(wěn)減速動畫沒有振蕩谤碳。 這里值為 0~1
velocity 彈簧的速率溃卡。數(shù)值越小，動力越小蜒简，彈簧的拉伸幅度就越小瘸羡。反之相反。比如：總共的動畫運行距離是200 pt搓茬，你希望每秒 100pt 時犹赖，值為 0.5；
PS:
[UIView animateWithDuration:2
delay:2
usingSpringWithDamping:.5
initialSpringVelocity:.5
options:UIViewAnimationOptionRepeat
animations:^{
view.center = self.view.center;
} completion:^(BOOL finished) {
}];
彈簧動畫
過渡動畫
//view 參與轉(zhuǎn)換的視圖
+ (void)transitionWithView:(UIView *)view
duration:(NSTimeInterval)duration
options:(UIViewAnimationOptions)options
animations:(void (^ __nullable)(void))animations
completion:(void (^ __nullable)(BOOL finished))completion
PS:
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
view.center = self.view.center;
view.backgroundColor = [UIColor redColor];
[self.view addSubview:view];
UIView *view_1 = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 50, 50)];
view_1.backgroundColor = [UIColor yellowColor];
[UIView transitionWithView:view
duration:3
options:UIViewAnimationOptionTransitionCurlUp
animations:^{
[view addSubview:view_1];
} completion:^(BOOL finished) {
}];
過渡動畫1
//fromView 一開始的視圖, toView 轉(zhuǎn)換后的視圖
+ (void)transitionFromView:(UIView *)fromView
toView:(UIView *)toView
duration:(NSTimeInterval)duration
options:(UIViewAnimationOptions)options
completion:(void (^ __nullable)(BOOL finished))completion
PS:
UIView *baseView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
baseView.center = self.view.center;
[self.view addSubview:baseView];
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
view.backgroundColor = [UIColor redColor];
[baseView addSubview:view];
UIView *view_1 = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 100)];
view_1.backgroundColor = [UIColor yellowColor];
[UIView transitionFromView:view
toView:view_1
duration:2
options:UIViewAnimationOptionTransitionFlipFromLeft
completion:^(BOOL finished) {
}];
過渡動畫2
關(guān)鍵幀動畫
/**
* @param duration 總持續(xù)時間
* @param UIViewKeyframeAnimationOptions options 枚舉 下面說明
* @param frameStartTime 相對開始時間
* @param frameDuration 相對持續(xù)時間
*/
+ (void)animateKeyframesWithDuration:(NSTimeInterval)duration
delay:(NSTimeInterval)delay
options:(UIViewKeyframeAnimationOptions)options
animations:(void (^)(void))animations
completion:(void (^ __nullable)(BOOL finished))completion
+ (void)addKeyframeWithRelativeStartTime:(double)frameStartTime
relativeDuration:(double)frameDuration
animations:(void (^)(void))animations
PS:
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 50, 50)];
view.backgroundColor = [UIColor orangeColor];
[self.view addSubview:view];
[UIView animateKeyframesWithDuration:3 delay:3 options:UIViewKeyframeAnimationOptionRepeat animations:^{
[UIView addKeyframeWithRelativeStartTime:0 relativeDuration:.3 animations:^{
view.frame = CGRectMake(20, 100, 100, 100);
}];
[UIView addKeyframeWithRelativeStartTime:.3 relativeDuration:.6 animations:^{
view.frame = CGRectMake(60, 100, 80, 80);
}];
[UIView addKeyframeWithRelativeStartTime:.6 relativeDuration:1 animations:^{
view.frame = CGRectMake(20, 20, 50, 50);
}];
} completion:^(BOOL finished) {
}];
關(guān)鍵幀動畫
UIViewKeyframeAnimationOptions
UIViewKeyframeAnimationOptionLayoutSubviews //提交動畫的時候布局子控件卷仑，表示子控件將和父控件一同動畫峻村。
UIViewKeyframeAnimationOptionAllowUserInteraction //動畫時允許用戶交流，比如觸摸 UIViewKeyframeAnimationOptionBeginFromCurrentState //從當(dāng)前狀態(tài)開始動畫
UIViewKeyframeAnimationOptionRepeat //動畫無限重復(fù)
UIViewKeyframeAnimationOptionAutoreverse //執(zhí)行動畫回路,前提是設(shè)置動畫無限重復(fù)
UIViewKeyframeAnimationOptionOverrideInheritedDuration //忽略外層動畫嵌套的執(zhí)行時間
UIViewKeyframeAnimationOptionOverrideInheritedOptions //忽略嵌套繼承的選項
關(guān)鍵幀動畫獨有
UIViewKeyframeAnimationOptionCalculationModeLinear //選擇使用一個簡單的線性插值計算的時候關(guān)鍵幀之間的值锡凝。
UIViewKeyframeAnimationOptionCalculationModeDiscrete //選擇不插入關(guān)鍵幀之間的值,而是直接跳到每個新的關(guān)鍵幀的值粘昨。
UIViewKeyframeAnimationOptionCalculationModePaced //選擇計算中間幀數(shù)值算法使用一個簡單的節(jié)奏。這個選項的結(jié)果在一個均勻的動畫。
UIViewKeyframeAnimationOptionCalculationModeCubic //選擇計算中間幀使用默認(rèn)卡特莫爾羅花鍵,通過關(guān)鍵幀的值张肾。你不能調(diào)整該算法的參數(shù)芭析。 這個動畫好像會更圓滑一些..
UIViewKeyframeAnimationOptionCalculationModeCubicPaced //選擇計算中間幀使用立方計劃而忽略的時間屬性動畫。相反,時間參數(shù)計算隱式地給動畫一個恒定的速度吞瞪。
最后兩個
+ (void)performSystemAnimation:(UISystemAnimation)animation
onViews:(NSArray *)views
options:(UIViewAnimationOptions)options
animations:(void (^ __nullable)(void))parallelAnimations completion:(void (^ __nullable)(BOOL finished))completion
+ (void)performWithoutAnimation:(void (NS_NOESCAPE ^)(void))actionsWithoutAnimation
1.刪除視圖上的子視圖 animation這個枚舉只有一個刪除值...
views操作的view 這會讓那個視圖變模糊馁启、收縮和褪色, 之后再給它發(fā)送 removeFromSuperview 方法。
2.在動畫block中不執(zhí)行動畫的代碼.
PS:
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 50, 50)];
view.backgroundColor = [UIColor orangeColor];
[self.view addSubview:view];
UIView *view_1 = [[UIView alloc] initWithFrame:CGRectMake(10, 10, 20, 20)];
view_1.backgroundColor = [UIColor redColor];
[view addSubview:view_1];
[UIView animateKeyframesWithDuration:3 delay:3 options:UIViewKeyframeAnimationOptionRepeat|UIViewKeyframeAnimationOptionAutoreverse animations:^{
view.frame = CGRectMake(100, 100, 50, 50);
[UIView performWithoutAnimation:^{
view.backgroundColor = [UIColor blueColor];
}];
} completion:^(BOOL finished) {
}];
[UIView performSystemAnimation:UISystemAnimationDelete
onViews:@[view_1]
options:0
animations:^{
view_1.alpha = 0;
} completion:^(BOOL finished) {
}];
image
