Подтвердить что ты не робот

Как сделать последовательность анимации UIView повторяющейся и автореверсивной

Как сделать эту сложную анимацию повторяющейся и автореверсивной? Есть ли способ добавить опции UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat к этой последовательности анимации?

   [UIView animateWithDuration:1.0f animations:^{

        someView.frame = someFrame1;

    } completion:^(BOOL finished) {

        [UIView animateWithDuration:0.5f animations:^{

            someView.frame = someFrame2;

        } completion:nil];

    }];
4b9b3361

Ответ 1

Для анимации из пунктов 1 - 2 - 3 - 2 к 1 и повторите, вы можете использовать animateKeyframesWithDuration в iOS 7 и более поздних версиях:

someView.frame = frame1;
[UIView animateKeyframesWithDuration:2.0 delay:0.0 options:UIViewKeyframeAnimationOptionAutoreverse | UIViewKeyframeAnimationOptionRepeat animations:^{
    [UIView addKeyframeWithRelativeStartTime:0.0 relativeDuration:0.5 animations:^{
        someView.frame = frame2;
    }];
    [UIView addKeyframeWithRelativeStartTime:0.5 relativeDuration:0.5 animations:^{
        someView.frame = frame3;
    }];
} completion:nil];

При использовании автоматической компоновки вы можете анимировать изменение констант ограничения:

[UIView animateKeyframesWithDuration:2.0 delay:0.0 options:UIViewKeyframeAnimationOptionAutoreverse | UIViewKeyframeAnimationOptionRepeat animations:^{
    [UIView addKeyframeWithRelativeStartTime:0.0 relativeDuration:0.5 animations:^{
        topConstraint.constant = 200;
        leftConstraint.constant = 200;
        [self.view layoutIfNeeded];
    }];
    [UIView addKeyframeWithRelativeStartTime:0.5 relativeDuration:0.5 animations:^{
        topConstraint.constant = 100;
        leftConstraint.constant = 300;
        [self.view layoutIfNeeded];
    }];
} completion:nil];

Или подход с автоматическим макетом заключается в деактивации ограничений, а затем вы можете анимировать с помощью значений frame или того, что у вас есть.


В более ранних версиях iOS вы можете использовать CAKeyframeAnimation, например, для анимации по пути:

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(100.0, 100.0)];
[path addLineToPoint:CGPointMake(200.0, 200.0)];
[path addLineToPoint:CGPointMake(100.0, 300.0)];

CAKeyframeAnimation *animatePosition = [CAKeyframeAnimation animationWithKeyPath:@"position"];
animatePosition.path = [path CGPath];
animatePosition.duration = 1.0;
animatePosition.autoreverses = YES;
animatePosition.repeatCount = HUGE_VALF;
[self.someView.layer addAnimation:animatePosition forKey:@"position"];

Вы можете сделать это, сколько угодно очков. Это также полезный метод, если вы хотите анимировать вдоль криволинейного пути (например, круг или беззерновую кривую).


Чтобы просто оживить две точки, вы можете использовать animateWithDuration:delay:options:animations:completion:, например:

[UIView animateWithDuration:0.5
                      delay:0.0
                    options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat | UIViewAnimationOptionCurveEaseInOut
                 animations:^{
                     // do whatever animation you want, e.g.,

                     someView.frame = someFrame1;
                 }
                 completion:NULL];

Это оживляет движение someView от исходного кадра до someFrame1 и обратно.

Кстати, использование UIViewAnimationOptionCurveEaseInOut в сочетании с UIViewAnimationOptionAutoreverse и UIViewAnimationOptionRepeat даст вам более плавный эффект, когда анимация меняет направление и повторяет.

Ответ 2

    UIImageView *pin = [UIImageView new];
    [pin setFrame:CGRectMake(115, 160, 30, 60)];
    [pin setBackgroundColor:[UIColor redColor]];
    [holderView addSubview:pin];

    [UIView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat
                     animations:^{
                        // [pin setTransform:CGAffineTransformMakeTranslation(0, 20)];
                         [pin setFrame:CGRectMake(115, 200, 60, 100)];
                     }completion:^(BOOL finished){

                     }];