CODEWITHSUNDEEP
iosuiviewanimation
piggyback
piggyback

Reputation: 9264

Change backgroundColor of a view repeatedly and with animation

I am planning to do an app which has a continuous change of colors in the background. In my idea, there should be an UIView animation after the other one that should repeat itself again and again. This my attempt

self.view.backgroundColor = [UIColor whiteColor];
[UIView animateWithDuration:4 delay:0 options: UIViewAnimationOptionRepeat | UIViewAnimationOptionCurveEaseInOut | UIViewAnimationOptionAutoreverse  animations:^{
    [UIView animateWithDuration:1 delay:0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
        self.view.backgroundColor = [UIColor yellowColor];
        NSLog(@"1");
    } completion:^(BOOL finished){
        [UIView animateWithDuration:1 delay:0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
            self.view.backgroundColor = [UIColor greenColor];
            NSLog(@"2");
        } completion:^(BOOL finished){
            [UIView animateWithDuration:1 delay:0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
                self.view.backgroundColor = [UIColor redColor];
                NSLog(@"3");
            } completion:^(BOOL finished){
                [UIView animateWithDuration:1 delay:0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
                    self.view.backgroundColor = [UIColor purpleColor];
                    NSLog(@"4");
                } completion:NULL];
            }];
        }];
    }];


} completion:NULL];

However this doesn't only look messy, but also doesn't repeat itself. Any advice?

Upvotes: 0

Views: 450

Answers (1)

Wain
Wain

Reputation: 119041

Have an array of colours and a currentColorIndex property. Something which gives you the list of colours and a current position in the list. Now have a single method with a single animateWithDuration: in it. In that method, get the next colour and then update the index (wrapping back to 0 when it gets to the end) and run the animation. In the animation completion block, call the method again.

Upvotes: 1

Related Questions