Bibin Jacob Bibin Jacob - 11 months ago 55
iOS Question

View transform rotation nullify image rendering effects in iOS

I've created a

UIButton
as follows (round button with shadow properties nothing too fancy):

let button = UIButton(type: .system)
button.backgroundColor = UIColor(hexString: "4267B2")
button.tintColor = .white
button.setImage(#imageLiteral(resourceName: "add").withRenderingMode(.alwaysTemplate), for: .normal)
button.addTarget(self, action: #selector(handleClick), for: .touchUpInside)
button.translatesAutoresizingMaskIntoConstraints = false
button.layer.cornerRadius = 32
button.layer.shadowColor = UIColor.darkGray.cgColor
button.layer.shadowRadius = 6
button.layer.shadowOpacity = 0.6
button.layer.shadowOffset = CGSize.zero


Purpose is to seem as an add button on click it rotates to form a cross button.

func handleClick() {
button.isSelected = !newPostButton.isSelected
let rotationDirection: CGFloat = button.isSelected ? 1: -1
UIView.animate(withDuration: 0.5) {
self.button.transform = self.button.transform.rotated(by: (rotationDirection * .pi/4))
}
}


The issue I encounter is when the animation occur for rotation the rotation works perfectly but the image provided for button
.withRendering:
is nullified as shown below:

Initially Finally

Is there a fix? (with code no libraries please) I searched through the net but none had a similar issue.

Answer Source

You could set your button type to .custom instead of .system. This should fix your problem.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download