自增长数字效果实现

2017-09-01  本文已影响0人  南京小伙

工程中要实现下图自增长数字的效果。

实现的思想:从开始到本次数字跳动所花费的时间占总动画时长的比率,通过这个比率来换算出本次数字跳动该出现的值。

需要 CADisplayLink 来帮助实现。(在波浪中已经使用过了)

构造方法:

- (void)countFromValue:(CGFloat)fromValue toValue:(CGFloat)toValue duration:(NSTimeInterval)duration {

      _toValue = toValue; //最大值

      _fromValue = fromValue;  // 初始值

     _duration = duration; // 持续时间

     _progress = 0; // 从开始到本次数字跳动占总时间的进度

     _lastUpdate = [NSDate timeIntervalSinceReferenceDate]; // 本次跳动的上次数字跳动

     self.displayLink = [CADisplayLink displayLinkWithTarget:self selector:@selector(updateValue:)];

     [self.displayLink addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSRunLoopCommonModes];

}

- (void)updateValue:(CADisplayLink *)displayLink {

        NSTimeInterval now = [NSDate timeIntervalSinceReferenceDate];

        _progress += now - _lastUpdate;  // 通过每次 _progress 累加来计算总进度

        _lastUpdate = now;

        [self setTextValue:[self currentValue]];

}

- (void)setTextValue:(CGFloat)value {

    NSString *str = [NSString stringWithFormat:@"%f",value];

    self.text = str;

}

- (CGFloat)currentValue {

    if (_progress >= _duration) {  // _progress 是否大于总时长

      return _toValue;

     }

    CGFloat percent = _progress / _duration; // 累加的_progress占总时间的比率

//    CGFloat updateVal = powf(percent, 3.f); // 可以通过次方来加速增长

    return _fromValue + (percent * (_toValue - _fromValue)); // 本次跳动的数字

}

 
上一篇下一篇

猜你喜欢

热点阅读