title: Animate multiple views where one starts before another finishes
body: <p>I'd like to animate several views, which are essentially squares that get bigger then go back to original size. The number of views can vary and are animated in sequential order, where one view animation starts just before its preceding view completes. I tried the following:</p>
  
  <pre><code>for (int i = 0; i &lt; 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) {
                                          }];
                       }];
    }
  }
  </code></pre>
  
  <p>This ends up being very choppy and "blinking", if that makes sense, and nothing like what I was expecting. Any idea how to accomplish this sequential animation and still make it very smooth?</p>