用数字动画 UILabel答案

【问题标题】：Animate UILabel with numbers用数字动画 UILabel
【发布时间】：2012-07-25 21:15:04
【问题描述】：

我还在学习 UIAnimations，刚开始接触它，我偶然发现了一个我不知道如何解决的问题。我见过你获得新的高分的游戏，它将新的高分添加到旧的高分中，它们使数字上升或下降。它看起来很酷，视觉上令人愉悦。

谁能给我解释一下这是怎么做到的？如果这个问题很容易解决，我深表歉意，就像我说我仍在努力学习/完善动画一样。

提前致谢

【问题讨论】：

【解决方案1】：

我从post sergio suggested you look at 中获取了代码，但注意到 Anshu 提到您想要一个上下移动的动画而不是淡入/淡出动画，所以我更改了代码以适应您想要的.给你：

// Add transition (must be called after myLabel has been displayed)
CATransition *animation = [CATransition animation];
animation.duration = 1.0;   //You can change this to any other duration
animation.type = kCATransitionMoveIn;     //I would assume this is what you want because you want to "animate up or down"
animation.subtype = kCATransitionFromTop; //You can change this to kCATransitionFromBottom, kCATransitionFromLeft, or kCATransitionFromRight
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
[myLabel.layer addAnimation:animation forKey:@"changeTextTransition"];

// Change the text
myLabel.text = newText;

希望这会有所帮助！

【讨论】：

@AlexG - 没问题。您可能想稍微调整一下参数，但它应该可以正常工作。

【解决方案2】：

如果我在这里错了，人们可以纠正我，但我很确定你必须手动编写这个动画。如果你足够努力的话，你也许可以在网上的某个地方找到一个开源版本。

可以拍摄UILabel 的图像并使用sizeWithFont: 来确定每个字符的宽度，然后根据每个数字将图像切割成多个部分。或者，您可以为每个数字设置多个 UILabels。

一旦你有了一个数字图像数组，你就必须计算在转换过程中哪些数字会发生变化，以及它们是增加还是减少，然后通过将其推入来转换到下一个数字顶部/底部（我认为有一个内置的过渡可以做到这一点，请查看 Core Animation 文档）。

您可能想要确定它们增加/减少了多少，并用它来计算动画需要多长时间。那样的话，如果你从 5 到 900，最后一个数字的动画必须非常快，倒数第二个数字的动画速度是 1/10，第三个数字是 1/100，等等。

【讨论】：

感谢您的解释。 Qegal 提供了这个例子，所以我只接受这个原因。 +1 以获得好的答案

【解决方案3】：

这很好，使用显示功能。有一些垂直运动会很好，但它要么是 kCATransitionFromBottom 要么是 kCATransitionFromTop - 实际上我们需要 kCATransitionFromBottom | kCATransitionToTop，但那不是一回事。代码如下：

-(void)countUpLabel:(UILabel *)label fromValue:(int)fromValue toValue:(int)toValue withDelay:(float)delay{

    int distance = (int)toValue - (int)fromValue;
    int absDistance = abs(distance);
    float baseDuration = 1.0f;
    float totalDuration = absDistance / 100.0f * baseDuration;
    float incrementDuration = totalDuration / (float)absDistance;
    int direction = (fromValue < toValue) ? 1 : -1;
    //NSString * subtype = (direction == 1) ? kCATransitionFromBottom : kCATransitionFromTop;

    for (int n = 0; n < absDistance; n++){

        dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(delay * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{

            CATransition * fade = [CATransition animation];
            fade.removedOnCompletion = true;
            fade.duration = incrementDuration;
            fade.type = kCATransitionReveal;
            fade.subtype = kCATransitionMoveIn;
            [label.layer addAnimation:fade forKey:@"changeTextTransition"];

            int value = fromValue + (n+1) * direction;
            label.text = [NSString stringWithFormat:@"%i", value];

        });

        delay += incrementDuration;
    }
}

【讨论】：