How to animate the change of background color of a view on iOS ?

· 142 words · 1 minute read

Step by step guide to create background color changing with beautiful animation 🔗

  1. open Main.storyboard add a button as shown below

create button in main storyboard

  1. add one @IBAction for touchUpInside of ‘Change Background’ button. Name the function as changeBackgroundClicked.

  2. use animate function of UIView to animate the change of background color. It provides us the duration and optional completion as parameters. In changeBackgroundClicked we will change the background color of the view from red to blue and vice versa. Here is the code.

@IBAction func changeBackgroundClicked(_ sender: Any) {
   if self.view.backgroundColor == UIColor.red {
      UIView.animate(withDuration: 2) {
         self.view.backgroundColor = UIColor.blue
      }
   } else {
      UIView.animate(withDuration: 2) {
         self.view.backgroundColor = UIColor.red
      }
   }
}

Run the app with iPhone simulator in Xcode. And tap on the button, the background color will change from red to blue, and from blue to red with a beautiful transition animation fading.

Share:
waffarx cash back