subview background color not animating

Question

I have a UIViewController that contains a subview that renders a waveform. When a button is pressed, I'm trying to get the main UIView , the subview, and the navigation bar to change from white to gray. I've been able to get the main view and navigation bar to change, but can't figure out how to get the subview with the waveform to change. Right now the subview instantly changes to gray rather than animating in sync with the other view and navigation bar.

//View Controller Code

UIView.animate(withDuration: 10.0, animations: {

    self.navigationController?.navigationBar.barTintColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00)
    self.navigationController?.navigationBar.layoutIfNeeded()
    self.waveform.backgroundColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00)
    self.view.backgroundColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00)

    }, completion: { finished in

         //do stuff
 })

//waveform view

override init(frame: CGRect) {
    super.init(frame: frame)
    self.setup()
}

required init?(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
    self.setup()
}

override func draw(_ rect: CGRect) {
    for i in 0..<self.circles.count {
        self.draw(self.circles[i], ratio: -1.0)
        self.draw(self.circles[i], ratio: 1.0)
    }
}

func update(_ level: Double) {

    amplitude = fmin(normalizedPowerLevelFromDecibels(level), maxAmplitude)
    setNeedsDisplay()
}

//Updated animation

UIView.transition(with: self.view, duration: 1.0, options: [.transitionCrossDissolve], animations: {

    self.view.backgroundColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00)


    self.navigationController?.navigationBar.barTintColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00)
    self.navigationController?.navigationBar.layoutIfNeeded()

    self.waveform.backgroundColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00)

}, completion: nil)

This causes the waveform view and navigation bar to animate in sync, but self.view changes to dark gray instantly after the two other views are done animating...

Answer 1

My idea of doing animation is like this

Objective-C

//Set Initial frame or color here & then write block for animation

 [UIView animateWithDuration:1.0f animations:^{

      // Now set your changing animation frame or color here

    }completion:^(BOOL finished) {

        //Do completion stuff here

    }];

If you are going to set it by anyView.layer.backgroundColor then #import <QuartzCore/QuartzCore.h>

Swift

//Set Initial frame or color here & then write block for animation

UIView.animate(withDuration: 5.0, animations: {

      // Now set your changing animation frame or color here
      self.view.layer.backgroundColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00).cgColor

}, completion: { finished in

            //do completion stuffs
    })

If you are going to set it by anyView.layer.backgroundColor then import QuartzCore

Answer 2

Try this in:-

   UIView.animate(withDuration: 1.0, delay: 0.0, options:[.transitionCrossDissolve], animations: {
        self.view1.backgroundColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00)
        self.view2.backgroundColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00)

        self.view.backgroundColor = UIColor(red: 26.00/255, green: 152.00/255, blue: 143.00/255, alpha: 1.00)


        self.navigationController?.navigationBar.barTintColor = UIColor(red: 20.00/255, green: 20.00/255, blue: 20.00/255, alpha: 1.00)
        self.navigationController?.navigationBar.layoutIfNeeded()
    }, completion:nil)

Answer 3

So the waveform view background color can't be animated because of my implementation of drawRect . What I had to do was to set the background color to the waveform view to clear, then add another UIView behind it and animate the background color of that view.