iOS - Smooth Color Change Transition/Animation iOS - Smooth Color Change Transition/Animation ios ios

iOS - Smooth Color Change Transition/Animation


One very simple way to accomplish this would be to use a UIView animation block.

[UIView animateWithDuration:1.0 animations:^{    view.backgroundColor = [UIColor redColor];}];

This will interpolate between whatever view's previous background color was, and red over the course of 1 second.

Swift:

UIView.animate(withDuration: 1.0) {     view.backgroundColor = .red}


One possible way of doing it is apply background color animation on view's layer.

Now to pass through entire spectrum you have to work on combinations of three colors.

The best way to achieve this is to use 'Hue'.

[[UIColor alloc] initWithHue:135/360.0f saturation:1 brightness:1 alpha:1]

Now you have to iterate for all Hue values and you will get the smooth transition that goes across all the spectrum.

Sample code:

  1. make a local variable

int _currentColorHue = 0;

  1. recursive call for change background color.

-(void)animateMyView {

[UIView animateWithDuration:0.01 animations:^{    self.view.layer.backgroundColor = [[UIColor alloc] initWithHue:_currentColorHue/360.0f saturation:1 brightness:1 alpha:1].CGColor;} completion:^(BOOL finished){    _currentColorHue++;    if (_currentColorHue > 360)    {        _currentColorHue = 0;    }    [self animateMyView];}];}

You can stop the animation according to your use.


Use following code for color transition in iOS, it gives you various configureable options:
1) Delay before starting animation
2) Callback on animation completion
3) Options for animation

[UIView animateWithDuration:1.0 delay:0.2 options:0 animations:^{        view.backgroundColor = [UIColor greenColor];    } completion:^(BOOL finished)     {         NSLog(@"Color transformation Completed");     }];

For Detailed description of different animations please visit:
UIView Tutorial for iOS: How To Use UIView Animation