效果圖:
代碼解析:
主要原理是使用UIBezierPath繪制運動軌跡,并使用CAKeyframeAnimation實現(xiàn)動畫.通過設(shè)置timingFunction來改變動畫的速度,設(shè)置timeOffset改變動畫的初始位置.原理比較簡單直接看代碼吧
- (void)configPoint {
NSInteger pointCount = self.pointNumber;
CGFloat countFloat = (CGFloat)pointCount;
//每個點動畫之間的時間間隔;
CGFloat timeInterval = 0.75 * _animationDuration / countFloat;
[self clearPoints];
for (NSInteger i = 0; i < pointCount; i++) {
UIView *pointView = [self getPoint];
[self addSubview:pointView];
[self.pointArray addObject:pointView];
pointView.alpha = 1;
CAKeyframeAnimation *animation = [self getKeyAnimation];
//設(shè)置timeOffset,即初始偏移量
animation.timeOffset = ( 2 - i ) * timeInterval;
[pointView.layer addAnimation:animation forKey:@"animation"];
}
}
- (CAKeyframeAnimation *)getKeyAnimation {
CGFloat radius = (self.frame.size.width - _pointWidth) / 2;
CGPoint centerPoint = CGPointMake(self.frame.size.width / 2, self.frame.size.height / 2);
//使用UIBezierPath繪制運動軌跡
UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:[self getBeginPoint]];
[path addArcWithCenter:centerPoint radius:radius startAngle:- M_PI / 2 endAngle:M_PI * 3 / 2 clockwise:1];
CAKeyframeAnimation *keyAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
keyAnimation.repeatCount = MAXFLOAT;
keyAnimation.path = path.CGPath;
keyAnimation.duration = _animationDuration;
keyAnimation.autoreverses = NO;
keyAnimation.fillMode = kCAFillModeBoth;
keyAnimation.removedOnCompletion = NO;
keyAnimation.calculationMode = kCAAnimationPaced;
//設(shè)置動畫速度.
keyAnimation.timingFunction = [CAMediaTimingFunction functionWithControlPoints:0.95 :0.35 :0.05 :0.7];
return keyAnimation;
}
輔助工具:
設(shè)置timingFunction時可以用 這個工具 獲取合適的動畫參數(shù).
