版本記錄
版本號 | 時間 |
---|---|
V1.0 | 2017.12.02 |
前言
適當(dāng)?shù)膭赢嬚故究梢蕴岣逜PP的炫酷效果爬立,提高用戶忠誠度和粘性,但是在動畫集成過程中万哪,不僅可能帶來性能問題侠驯,還會引起其他交互中的問題,這些都是開發(fā)人員在開發(fā)過程中比較耗時和需要注意的問題奕巍。接下來這幾篇我就說一下做各種動畫時碰到的各種性能等各種坑和問題吟策。感興趣的可以看前面幾篇。
1. 動畫集成中遇到的坑 —— 動畫過程中的點擊問題(一)
問題描述
UIViewKeyframeAnimationOptionBeginFromCurrentState
是UIView動畫中的一個option枚舉的止,這個表示從當(dāng)前狀態(tài)開始動畫檩坚。第一次動畫正常結(jié)束后,當(dāng)我們第二次開始動畫時候诅福,即使已經(jīng)設(shè)置了初始frame匾委,動畫就不從初始frame開始,而是從第一次動畫結(jié)束位置開始的第二次動畫氓润。
下面看一下該部分的代碼赂乐。
#import "ViewController.h"
#import "UIView+Tool.h"
@interface ViewController ()
@property (nonatomic, strong) UIImageView *testImageView;
@property (nonatomic, assign) CGFloat giftWidth;
@property (nonatomic, assign) CGFloat giftHeight;
@property (nonatomic, assign) CGFloat startXRatio;
@property (nonatomic, assign) CGFloat startYRatio;
@property (nonatomic, assign) CGFloat pauseXRatio;
@property (nonatomic, assign) CGFloat pauseYRatio;
@property (nonatomic, assign) CGFloat endXRatio;
@property (nonatomic, assign) CGFloat endYRatio;
@property (nonatomic, assign) CGFloat startDuration;
@property (nonatomic, assign) CGFloat endDuration;
@property (nonatomic, assign) CGFloat pauseDuration;
@end
@implementation ViewController
- (void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
[self startAnimation];
}
- (void)viewDidLoad
{
[super viewDidLoad];
self.view.backgroundColor = [UIColor lightGrayColor];
self.testImageView = [[UIImageView alloc] init];
self.testImageView.backgroundColor = [UIColor redColor];
[self.view addSubview:self.testImageView];
}
- (void)startAnimation
{
self.giftWidth = 100.0;
self.giftHeight = 100.0;
self.startXRatio = 0.2;
self.startYRatio = 0.3;
self.pauseXRatio = 0.5;
self.pauseYRatio = 0.5;
self.endXRatio = 0.8;
self.endYRatio = 1.0;
self.startDuration = 5;
self.pauseDuration = 1;
self.endDuration = 5;
CGSize screenSize = [UIScreen mainScreen].bounds.size;
self.testImageView.frame = CGRectMake(100.0, 100.0, 100.0, 100.0);
NSLog(@"開始動畫了");
//動畫
CGFloat totalDuration = self.startDuration + self.pauseDuration + self.endDuration;
[UIView animateKeyframesWithDuration:totalDuration
delay:0
options:UIViewKeyframeAnimationOptionAllowUserInteraction | UIViewKeyframeAnimationOptionBeginFromCurrentState
animations:^{
//start
CGFloat startTime = 0.f;
CGFloat duration = self.startDuration / totalDuration;
[UIView addKeyframeWithRelativeStartTime:startTime
relativeDuration:duration
animations:^{
self.testImageView.origin = CGPointMake(self.pauseXRatio * screenSize.width,
self.pauseYRatio * screenSize.height);
}];
//pause
startTime += duration;
duration = self.pauseDuration / totalDuration;
[UIView addKeyframeWithRelativeStartTime:startTime
relativeDuration:duration
animations:^{}];
//end
startTime += duration;
duration = self.endDuration / totalDuration;
[UIView addKeyframeWithRelativeStartTime:startTime
relativeDuration:duration
animations:^{
self.testImageView.origin = CGPointMake(self.endXRatio * screenSize.width,
self.endYRatio * screenSize.height);
}];
} completion:^(BOOL finished) {
NSLog(@"over");
}];
}
@end
下面我們看一下效果圖。
問題解決
這里我們有兩個方法咖气,第一個就是刪除UIViewKeyframeAnimationOptionBeginFromCurrentState
這個枚舉挨措,第二個方法就是:
[UIView animateWithDuration:0 delay:0 options:0 animations:^{
self.testImageView.frame = CGRectMake(50.0, 100.0, 100.0, 100.0);
} completion:^(BOOL finished) {
//動畫
CGFloat totalDuration = self.startDuration + self.pauseDuration + self.endDuration;
}];
在我們做動畫之前辐啄,加上一個UIView動畫,并且將延時delay
和duration
都設(shè)置為0运嗜,然后在這里修改視圖的frame。
問題效果
下面我們就看一下問題效果圖悯舟。
感興趣的可以參考GitHub - 刀客傳奇
后記
未完担租,待續(xù)~~~