动画多意见,并在彼此完成之前启动(Animate multiple views where one

2019-10-21 11:48发布

我想动画几个意见,这实质上是获得更大然后返回到原始大小的正方形。 视图的数量可以改变,并且以顺序的次序是动画,其中,一个视图的动画开始其在前视图完成之前。 我试过如下:

for (int i = 0; i < length; i++) {
    SView *view = _row[i];

    view.widthConstraint.constant *= 1.1;
    view.heightConstraint.constant *= 1.1;

    [UIView animateWithDuration:1
                          delay:1 * i
                        options:UIViewAnimationOptionCurveEaseInOut
                     animations:^{
                       [self.view layoutIfNeeded];
                     }
                     completion:^(BOOL finished) {
                       view.widthConstraint.constant /= 1.1;
                       view.heightConstraint.constant /= 1.1;

                       [UIView animateWithDuration:.1
                                             delay:0
                                           options:UIViewAnimationOptionCurveEaseInOut
                                        animations:^{
                                          [self.view layoutIfNeeded];
                                        } completion:^(BOOL finished) {
                                        }];
                     }];
  }
}

这最终被非常不连贯和“闪烁”,如果是有道理的,并没有像我所期待的。 任何想法如何做到这一点连续动画,仍然使它很流畅?

Answer 1:

要做到这一点, 正确的方法是通过使用关键帧。 它使更清洁的代码。 UIView的方法使用是这些:

animateKeyframesWithDuration:延迟:选项:动画:完成:addKeyframeWithRelativeStartTime:relativeDuration:动画:

简单的例子

下面是关于如何使用它的一个简单的例子:

[UIView animateKeyframesWithDuration:0.25
                               delay:0
                             options: UIViewKeyframeAnimationOptionBeginFromCurrentState
                          animations:^{
                              [UIView addKeyframeWithRelativeStartTime:0 relativeDuration:0.7 animations:^{
                                  avatarView.transform = CGAffineTransformMakeScale(0.9, 0.9);
                              }];
                              [UIView addKeyframeWithRelativeStartTime:0.7 relativeDuration:0.3 animations:^{
                                  avatarView.transform = CGAffineTransformIdentity;
                              }];
                          } completion:nil];

这个想法是,你定义了一个总的持续时间则打破了每个人的动画多少需要和相对于整个动画被延迟。

循环示例

如果您有需要进行关键帧多个视图,你其实可以有动画块内的循环。 这允许灵活和动态的代码。 下面是一个例子项目和一些代码:

[UIView animateKeyframesWithDuration:1.0
                               delay:0
                             options: UIViewKeyframeAnimationOptionBeginFromCurrentState
                          animations:^{
                              for (int i = 0; i < numberOfViews; i++) {
                                  [UIView addKeyframeWithRelativeStartTime:0 relativeDuration:(duration / numberOfViews) animations:^{
                                      ... animate view ...
                                  }];
                              }
                          } completion:nil];


Answer 2:

更清洁的动画方法是使用animateKeyframesWithDuration:delay:options:animations:completion:addKeyframeWithRelativeStartTime:relativeDuration:animations: 。 只是仰望如何使用这些API。

我觉得你会发现它最终被更清洁,更清晰。



文章来源: Animate multiple views where one starts before another finishes
标签: ios animation