更改 UILabel 的文本使其在使用 UIViewKeyframeAnimations 时重新出现

Posted 2023-03-12

【中文标题】更改 UILabel 的文本使其在使用 UIViewKeyframeAnimations 时重新出现

【英文标题】：Changing the text of a UILabel makes it reappear when using UIViewKeyframeAnimations

【发布时间】：2014-10-16 10:27:34

【问题描述】：

我想在UILabel 上执行一系列动画，所以我查找了在 ios7 中添加的UIViewKeyframeAnimations。

我想做的简化版是：

UILabel 淡出，持续时间为 0.5 秒 等待 1 秒

使用持续时间为 0.5 秒的新文本淡入 UILabel

NSTimeInterval duration = 2;
[UIView animateKeyframesWithDuration:duration delay:0 options:UIViewKeyframeAnimationOptionAllowUserInteraction | UIViewAnimationOptionOverrideInheritedOptions animations:^
    [UIView addKeyframeWithRelativeStartTime:0 relativeDuration:0.5/duration animations:^
        self.label.alpha = 0;
    ];

    [UIView addKeyframeWithRelativeStartTime:1.5/duration relativeDuration:0.5/duration animations:^
        self.label.text = [@(arc4random_uniform(4000)) stringValue];
        self.label.alpha = 1;
    ];
 completion:nil];

结果是标签文本淡出并重新出现新文本，然后再次淡出并再次淡入。

结果视频：Animation Failure

干杯 莫腾

【参考方案1】：

您声明：“结果是标签文本淡出并重新出现新文本，然后再次淡出并再次淡入。”。然而，我在电影中看到的是，alpha 过渡按预期工作，淡出和淡入。您所需行为的唯一例外是，文本更改在动画开始时已经应用，而不是在动画第二个关键帧的开始。

了解 addKeyframeWithRelativeStartTime 块中的代码会在调用 animateKeyframesWithDuration 后立即执行，这一点很重要。任何可动画的更改（帧、alpha 等）都将被动画化。同样，任何不是自动动画视图属性的内容（例如标签的文本更改）都将立即可见。

为了帮助说明这一点，请尝试在所有动画块（animateKeyframesWithDuration 和 addKeyframeWithRelativeStartTime）的开头放置一条 NSLog 语句，并在完成块中放置一条。您将看到完成块中的每个 NSLog except 具有完全相同的日志时间。

出于这个确切原因，下面的代码将工作，因为完整块的执行被推迟到第一个动画完成：

[UIView animateWithDuration:1 animations:^
    self.label.alpha = 0;
 completion:^(BOOL finished) 
    self.label.text = [@(arc4random_uniform(4000)) stringValue];
    [UIView animateWithDuration:1 animations:^
        self.label.alpha = 1;
    ];
];

【讨论】：

啊，好吧，所以我的选择是 1. 恢复到旧的 animateWithDuration 2. 引入一个临时的 UILabel 和 UIImageView 3. 使用一些 3rd 方 Promises 框架。选项 1 会因为长动画而变得非常混乱。

【参考方案2】：

这就是我要做的：我不会使用关键帧来制作像这样的简单动画，而是使用带有块的动画：

[UIView animateWithDuration:0.25 animations:^
 
     [self.label setAlpha:0.0];
     [self.imageview setAlpha:0.0];
 
                 completion: ^(BOOL completed)
 

     [UIView animateWithDuration:0.25 delay:0.5 options:UIViewAnimationOptionAllowUserInteraction animations:^
      
          self.label.text = [@(arc4random_uniform(4000)) stringValue];
          [self.label setAlpha:1.0];
      
                      completion: ^(BOOL completed)
      

      
      ];
     [UIView animateWithDuration:1.0 delay:0.5 options:UIViewAnimationOptionAllowUserInteraction animations:^
      
          [self.imageview setAlpha:1.0];
          [self.imageview setFrame:frame];
      
                      completion: ^(BOOL completed)
      
          //if you need to do stuff after the animations finish, here you can do them.
      
      ];
 
 ];

【讨论】：

它是一个简化的版本，真实的场景是：用0.25淡出UILabel和一个UIImageView等待0.5淡入UILabel用0.25的新文本同时淡入和将UIImageView 转换为 1.0

您可以使用类似的逻辑来构建您的目标。棘手的部分是UIImageView imo。给我几分钟的时间来编码并尝试..

是的，这是可能的，但嵌套使得阅读和验证变得更加困难。

试试看是否有效，我没有编译。它只是一层嵌套。不超过前面的代码。