如何制作一个秘密的iOS应用文本动画

Question

我正在尝试复制Secret App的文本标签转换。有没有人最好的方法来接近它？

看起来他们每个字母都以明文开始，然后将其设置为灰色，然后是白色文本颜色。

以下是一些截图：

Answer 1

这是另一种解决方案https://github.com/zipme/RQShineLabel

我将CADisplayLink与NSAttributedString一起使用，这样我们只需要一个UILabel，看看:)

Answer 2

谢谢大家的帮助。我能够通过一些修改来实现这一点，以防止标签一遍又一遍地消失。这是我的完整源代码：https://github.com/NatashaTheRobot/SecretTextAnimationExample

Answer 3

这是一种可能的方式。

首先，让我们注意UILabel可以保存并显示NSAttributedString。使用NSMutableAttributedString，您可以使每个字母成为不同的颜色。

因此，从两个标签开始，一个在另一个的顶部（即在它的前面，隐藏它），具有相同的文本但不同的字母颜色。现在将顶部的alpha消失为零，从而逐渐显露出背后的那个。因此，每个字母似乎都会逐渐呈现出背后字母的颜色。

Answer 4

我只是真的要扩展@matt所说的内容，并举例说明如何做到这一点。您从两个标签开始，一个标签直接在另一个标签的顶部，具有相同的属性和对齐。在配置两个标签并准备好动画之后，您所要做的就是淡出顶部标签。

- (void)awakeFromNib
{
    [super awakeFromNib];

    [self.view setBackgroundColor:[UIColor blackColor]];

    NSString *text = @"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";

    UILabel *label1 = [[UILabel alloc] initWithFrame:CGRectMake(0.0, 100.0, 320.0, 200.0)];
    [label1 setNumberOfLines:0];
    [label1 setBackgroundColor:[UIColor clearColor]];
    [label1 setAttributedText:[self randomlyFadedAttStringFromString:text]];
    [self.view addSubview:label1];

    UILabel *label2 = [[UILabel alloc] initWithFrame:CGRectMake(0.0, 100.0, 320.0, 200.0)];
    [label2 setNumberOfLines:0];
    [label2 setBackgroundColor:[UIColor clearColor]];
    [label2 setTextColor:[UIColor whiteColor]];
    [label2 setAttributedText:[[NSAttributedString alloc] initWithString:text]];
    [self.view addSubview:label2];

    dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(2.0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
        [UIView animateWithDuration:1.0 animations:^{
            [label2 setAlpha:0.0];
        } completion:^(BOOL finished) {
            [label2 removeFromSuperview];
        }];
    });
}

然后为底部标签创建一个特殊的属性字符串。此属性字符串不应修改您在NSForegroundColorAttributeName属性以外的其他标签上设置的任何属性。您可能想要或不想要某种算法来确定哪些字母应该以多少数量消失，但下面的代码将从输入字符串生成一个属性字符串，其中每个字母alpha只是0之间的随机值和1。

- (NSAttributedString *)randomlyFadedAttStringFromString:(NSString *)string
{
    NSMutableAttributedString *outString = [[NSMutableAttributedString alloc] initWithString:string];

    for (NSUInteger i = 0; i < string.length; i ++) {
        UIColor *color = [UIColor colorWithWhite:1.0 alpha:arc4random_uniform(100) / 100.0];
        [outString addAttribute:NSForegroundColorAttributeName value:(id)color range:NSMakeRange(i, 1)];
    }

    return [outString copy];
}