文章分享至我的個人技術部落格: https://cainluo.github.io/14972802953896.html
UIViewPropertyAnimator
我們之前在做基礎動畫效果的時候, 基本上的程式碼都是:
[UIView animateWithDuration:1
delay:0
options:UIViewAnimationOptionCurveEaseInOut
animations:^{
// Do Something
} completion:^(BOOL finished) {
// Do Something
}];
複製程式碼一般都會自己去封裝一下, 免得大串程式碼在這裡噁心....
但現在不用了咯, 自從蘋果爸爸在iOS 10推出了一個框架UIViewPropertyAnimator, 可以更簡潔的去省略很多程式碼, 我這裡是Objective-C版本的, 如果想要看Swift版本, 可以到這裡去看Swift版本
建立專案
廢話就少說了, 直接看程式碼吧:
對外開放的方法有:
用UIViewPropertyAnimator執行動畫的程式碼:
效果:
看完之後估計很多人都會說, 這個有什麼的, 之前的那個API也可以搞定, 那我們就繼續往下看看吧.
為什麼要用UIViewPropertyAnimator
這裡我找到了一段比較官方的說法:
UIViewPropertyAnimator的API設計得很完善，可擴充套件性也很好。它cover了傳統UIView animation動畫的絕大部分功能，並且大大增強了你對動畫過程的掌控能力。具體來說，你可以在動畫過程中任意時刻暫停，可以隨後再選擇繼續，甚至還能在動畫過程中動態改變動畫的屬性（例如，本來動畫終點在螢幕左下角的，可以在動畫過程中把終點改到右上角）。
看完介紹之後, 到底是不是醬紫呢, 我們來加一句程式碼看看:
// 新增多一個漸漸消失的動畫
[propertyAnimator addAnimations:^{
self.basicsView.alpha = 0;
}];
複製程式碼效果:
除了這個, 如果要新增動畫完成後的處理, 甚至是在動畫進行中的一些操作也是可以的:
[propertyAnimator addCompletion:^(UIViewAnimatingPosition finalPosition) {
NSLog(@"動畫結束咯");
}];
[propertyAnimator addCompletion:^(UIViewAnimatingPosition finalPosition) {
switch (finalPosition) {
case UIViewAnimatingPositionStart:
NSLog(@"動畫開始了");
break;
case UIViewAnimatingPositionCurrent:
NSLog(@"動畫結束咯");
break;
case UIViewAnimatingPositionEnd:
NSLog(@"正在執行動畫");
break;
default:
break;
}
}];
複製程式碼新增個拖拽器
UIViewPropertyAnimator不只是可以寫好了規定的動畫, 也可以和其他控制元件一起配合使用, 比如UISlider, 為了方便, 我就把UIViewPropertyAnimator *propertyAnimator設定成一個全域性屬性:
@property (nonatomic, strong) UIViewPropertyAnimator *propertyAnimator;
複製程式碼然後開始實現我們的拖拽動畫:
- (void)addSliderWithSuperView {
self.propertyAnimator = [[UIViewPropertyAnimator alloc] initWithDuration:5
curve:UIViewAnimationCurveEaseIn
animations:^{
[self.basicsView moveViewToBottmRight];
}];
UISlider *slider = [[UISlider alloc] initWithFrame:CGRectMake(0, 100, self.view.frame.size.width, 40)];
[slider addTarget:self
action:@selector(sliderValueChanged:)
forControlEvents:UIControlEventValueChanged];
[self.basicsView addSubview:slider];
}
- (void)sliderValueChanged:(UISlider *)slider {
self.propertyAnimator.fractionComplete = slider.value;
}
複製程式碼效果圖:
反向動畫
如果你覺得就醬紫結束了, 那就太沒意思了:
/**
反向動畫
*/
- (void)viewAnimationCurveEaseInOut {
UIButton *resetButton = [[UIButton alloc] initWithFrame:CGRectMake((self.view.frame.size.width / 2) - 100, 100, 200, 50)];
[resetButton setTitleColor:[UIColor blackColor]
forState:UIControlStateNormal];
[resetButton setTitle:@"開始反向動畫"
forState:UIControlStateNormal];
[resetButton addTarget:self
action:@selector(resetButtonAction)
forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:resetButton];
self.propertyAnimator = [[UIViewPropertyAnimator alloc] initWithDuration:3
curve:UIViewAnimationCurveEaseInOut
animations:^{
[self.basicsView moveViewToBottmRight];
}];
[self.propertyAnimator startAnimation];
}
/**
按鈕點選事件
*/
- (void)resetButtonAction {
self.propertyAnimator.reversed = YES;
}
複製程式碼效果:
UISpringTimingParameters
這裡還可以配合著UISpringTimingParameters來使用:
- (void)springTimingParameters {
weakSelf(weakSelf);
UISpringTimingParameters *springTimingParameters = [[UISpringTimingParameters alloc] initWithDampingRatio:0.3
initialVelocity:CGVectorMake(0, 0)];
self.propertyAnimator = [[UIViewPropertyAnimator alloc] initWithDuration:4
timingParameters:springTimingParameters];
[self.propertyAnimator addAnimations:^{
[weakSelf.basicsView moveViewToBottmRight];
} delayFactor:3.0];
[self.propertyAnimator startAnimation];
}
複製程式碼效果:
UICubicTimingParameters
這裡也可以配合著UICubicTimingParameters來玩耍~~
/**
UICubicTimingParameters 動畫
*/
- (void)cubicTimingParameters {
weakSelf(weakSelf);
UICubicTimingParameters *cubicTimingParameters = [[UICubicTimingParameters alloc] initWithControlPoint1:CGPointMake(0.05, 0.95)
controlPoint2:CGPointMake(0.15, 0.95)];
self.propertyAnimator = [[UIViewPropertyAnimator alloc] initWithDuration:4
timingParameters:cubicTimingParameters];
[self.propertyAnimator addAnimations:^{
[weakSelf.basicsView moveViewToBottmRight];
} delayFactor:0.25];
[self.propertyAnimator startAnimation];
}
複製程式碼效果:
大概就介紹到這裡吧, 更復雜的玩法就有待各位大神去慢慢挖掘了~~
工程地址
專案地址: https://github.com/CainRun/iOS-10-Characteristic/tree/master/4.UIViewPropertyAnimator
最後
