iOS动画开发----打分 数字滚动刷新动画

  最近项目中用到了打分动画. 在网上找到了很多Demo,最后找到了JTNumberScrollAnimatedView这个类实现的动画效果,和项目中用到的非常贴切,帮我省了不少时间,很感谢JTNumberScrollAnimatedView的提供作者,由于项目中有一些需求变动,因此自己改进了一下,写了一个Demo,方便读者参阅学习,废话不多说,直接上代码.

  1. 添加打分控件

UIFont *textFont = [UIFont systemFontOfSize:40];
    CGSize textSize = [@"9" sizeWithAttributes:[NSDictionary dictionaryWithObjectsAndKeys:textFont,NSFontAttributeName, nil]];

    //个位十位单独设置,可分别设定各自速度
    LNNumberScrollAnimatedView *socreTensDigitAnimation = [[LNNumberScrollAnimatedView alloc] initWithFrame:CGRectMake(100, 100, textSize.width, textSize.height)];
    socreTensDigitAnimation.backgroundColor = [UIColor whiteColor];
    [self.view addSubview:socreTensDigitAnimation];
    socreTensDigitAnimation.textColor = [UIColor redColor];
    socreTensDigitAnimation.font = textFont;
    socreTensDigitAnimation.density = 7;
    socreTensDigitAnimation.duration = 1.9;
    socreTensDigitAnimation.minLength = 1;
    [socreTensDigitAnimation setValue:@9];
    [socreTensDigitAnimation sizeToFit];
    socreTensDigitAnimation.isAscending = YES;
    socreTensDigitAnimation.durationOffset = 0.1;
    self.socreTensDigitAnimation = socreTensDigitAnimation;
    
    LNNumberScrollAnimatedView *socreDigitAnimation = [[LNNumberScrollAnimatedView alloc] initWithFrame:CGRectMake(100+textSize.width, 100, textSize.width, textSize.height)];
    socreDigitAnimation.backgroundColor = [UIColor whiteColor];
    [self.view addSubview:socreDigitAnimation];
    socreDigitAnimation.textColor = [UIColor redColor];
    socreDigitAnimation.font = textFont;
    [socreDigitAnimation setValue:@9];
    [socreDigitAnimation sizeToFit];
    socreDigitAnimation.density = 21;
    socreDigitAnimation.duration = 1.95;
    socreDigitAnimation.minLength = 1;
    socreDigitAnimation.isAscending = YES;
    socreDigitAnimation.durationOffset = 0.1;
    self.socreDigitAnimation = socreDigitAnimation;
    
    
    //个位十位统一设置,速度一样,可设置结束时间间隔差
    CGSize scoreTextSize = [@"19" sizeWithAttributes:[NSDictionary dictionaryWithObjectsAndKeys:textFont,NSFontAttributeName, nil]];
    LNNumberScrollAnimatedView *socreAnimation = [[LNNumberScrollAnimatedView alloc] initWithFrame:CGRectMake(CGRectGetMaxX(socreDigitAnimation.frame)+textSize.width, 100, scoreTextSize.width*1.1, scoreTextSize.height)];
    socreAnimation.backgroundColor = [UIColor whiteColor];
    [self.view addSubview:socreAnimation];
    socreAnimation.textColor = [UIColor blueColor];
    socreAnimation.font = textFont;
    [socreAnimation setValue:@19];
    [socreAnimation sizeToFit];
    socreAnimation.density = 21;
    socreAnimation.duration = 1.95;
    socreAnimation.minLength = 2;
    socreAnimation.isAscending = NO;
    socreAnimation.durationOffset = 0.1;
    self.socreAnimation = socreAnimation;

  

  2. 添加音效

#pragma mark - 播放音效
- (void)playSound
{
    NSURL *url = [[NSBundle mainBundle] URLForResource:@"number.wav" withExtension:nil];
    SystemSoundID soundID = 0;
    AudioServicesCreateSystemSoundID((__bridge CFURLRef)(url)
                                     , &soundID);
    AudioServicesPlayAlertSound (soundID);
}

 

  3. 执行动画

for (int i = 0; i<19; i++) {
        [self performSelector:@selector(playSound) withObject:nil afterDelay:0.1];
    }
    
    [self.socreTensDigitAnimation setValue:[NSNumber numberWithInt:1]];
    [self.socreTensDigitAnimation startAnimation];
    [self.socreDigitAnimation setValue:[NSNumber numberWithInt:9]];
    [self.socreDigitAnimation startAnimation];
    [self.socreAnimation startAnimation];

 

  效果如下:

Demo 下载地址:https://github.com/KrystalNa/numberAnimation

 

posted @ 2016-02-23 14:49  紫之灵玲  阅读(6578)  评论(0编辑  收藏  举报