rotate 180 degree for an UIImageView, and rotate back with same route

Question

I got a button and want to rotate the image inside it:

self.DashButton.imageView.transform = CGAffineTransformMakeRotation(M_PI);

The image is a up-arrow to down-arrow after user click it When clicking the button again, I want the down-arrow rotate to up-arrow again, but it is the same counterclockwise rotation, but I just want the arrow reverse back to up-arrow

rotate back code:

self.DashButton.imageView.transform = CGAffineTransformIdentity;

I tried

self.DashButton.imageView.transform = CGAffineTransformMakeRotation(-M_PI);

What I want is not rotate the full circle, just 180 rotate and -180 rotate, not a 360 full rotate

`CGAffineTransformMakeRotation(-0);`? – Larme Feb 11 '15 at 09:04 — Larme, Feb 11 '15 at 09:04
I have finished my answer. check it out. -0 does not help – Wingzero Feb 11 '15 at 09:26 — Wingzero, Feb 11 '15 at 09:26

score 20 · Accepted Answer · answered Feb 11 '15 at 07:02

20

instead of -M_PI, use -3.14159. Kind of a trick, but below code saved my day.

self.DashButton.imageView.transform = CGAffineTransformMakeRotation(M_PI);
self.DashButton.imageView.transform = CGAffineTransformMakeRotation(M_PI - 3.14159);

answered Feb 11 '15 at 07:02

Wingzero

9,644
10
39
80

This works as CoreAnimation calculates shortest transformation, and as a rounded pi is used the shortest transform is to reverse the rotation. Yet, in practice the rotation seems indistinguishable from using pi. – Johan Jan 24 '17 at 16:05

score 7 · Answer 2 · edited Aug 11 '16 at 13:25

7

self.DashButton.imageView.transform = CGAffineTransformMakeRotation(M_PI);
self.DashButton.imageView.transform = CGAffineTransformMakeRotation(0);

edited Aug 11 '16 at 13:25

Martin Tournoij

26,737
24
105
146

answered Aug 11 '16 at 13:21

Si Fisher

71
1
2

1

Welcome to Stack Overflow! Although this code may help to solve the problem, it doesn't explain _why_ and/or _how_ it answers the question. Providing this additional context would significantly improve its long-term value. Please [edit] your answer to add explanation, including what limitations and assumptions apply. – Toby Speight Aug 11 '16 at 16:38

score 6 · Answer 3 · edited May 23 '17 at 12:25

6

what you need is a negative angle to rotate it in the opposite direction

CGAffineTransformMakeRotation( 180 * CGFloat(M_PI/180))

CGAffineTransformMakeRotation(-1 * CGFloat(M_PI/180))

take a look at this answer for an explanation About CGAffineTransformMakeRotation rotation direction?

edited May 23 '17 at 12:25

Community

1
1

answered Sep 14 '15 at 18:32

Maria

4,471
1
25
26

score 4 · Answer 4 · answered Jun 23 '18 at 14:12

Swift 4 version of @Maria working answer

Rotate 180 degrees counter clockwise:

let transform = CGAffineTransform.identity

UIView.animate(withDuration: 0.3, animations: {
      // to rotate counterclockwise set both of these in this exact order
      self.button.transform = transform.rotated(by: 180 * CGFloat(Double.pi))
      self.button.transform = transform.rotated(by: -1 * CGFloat(Double.pi))
}

Rotate back 180 degrees clockwise:

UIView.animate(withDuration: 0.3, animations: { 
      self.button.transform = CGAffineTransform.identity
}

score 1 · Answer 5 · answered Feb 11 '15 at 06:28

1

try this

arrowLeft.transform = CGAffineTransformMakeRotation(180 *M_PI / 180.0);

arrowLeft.transform = CGAffineTransformMakeRotation(0*M_PI/180);

answered Feb 11 '15 at 06:28

AdrianHor

156
6

No, it does the same as my code. Have you tried it? What I want is not rotate the full circle, just 180 rotate and -180 rotate, not a 360 full rotate – Wingzero Feb 11 '15 at 06:38
the idea is not wrong, but rotate 0 still follow the same clockwise, I want the opposite clock. – Wingzero Feb 11 '15 at 07:03
@Wingzero Did you want to animate the changes? – Lyndsey Scott Feb 11 '15 at 07:04
See my answer, just want a 180 degree and a -180 rotate back. – Wingzero Feb 11 '15 at 07:04

score 0 · Answer 6 · answered Oct 05 '16 at 16:37

0

One can also use

imageView.image = UIImage(cgImage: imageView.image!.cgImage! , scale: 1.0, orientation: .down)

answered Oct 05 '16 at 16:37

Carien van Zyl

2,853
22
30

score 0 · Answer 7 · answered Feb 01 '17 at 06:58

0

how about this?

self.DashButton.imageView.transform = CGAffineTransformMakeRotation(M_PI);
self.DashButton.imageView.transform = CGAffineTransformMakeRotation(M_PI * 2);

it works on my code :)

answered Feb 01 '17 at 06:58

wsnjy

174
1
7

score 0 · Answer 8 · answered Sep 07 '22 at 17:07

Swift 5

 //Rotate button 180 degree
 func rotate180(){
        UIView.animate(withDuration: 0.3) {
            self.arrowButton.transform = CGAffineTransform(rotationAngle: .pi)
        }
    }
    //Back to normal state again

    func rotateBack(){
        UIView.animate(withDuration: 0.3) {
            self.arrowButton.transform = CGAffineTransform.identity
        }
    }

score -1 · Answer 9 · edited Mar 16 '18 at 12:09

Swift 3:

Using CABasicAnimation

var rotationAnimation = CABasicAnimation()
rotationAnimation = CABasicAnimation.init(keyPath: "transform.rotation.z")
rotationAnimation.toValue = NSNumber(value: (Double.pi))
rotationAnimation.duration = 1.0
rotationAnimation.isCumulative = true
rotationAnimation.repeatCount = 100.0
view.layer.add(rotationAnimation, forKey: "rotationAnimation")

Here is an extension functions for UIView that handles start & stop rotation operations:

extension UIView {

    func startRotation() {
        let rotation : CABasicAnimation = CABasicAnimation(keyPath: "transform.rotation.z")
        rotation.fromValue = 0
        rotation.toValue = NSNumber(value: Double.pi)
        rotation.duration = 1.0
        rotation.isCumulative = true
        rotation.repeatCount = FLT_MAX
        self.layer.add(rotation, forKey: "rotationAnimation")
    }

    func stopRotation() {
        self.layer.removeAnimation(forKey: "rotationAnimation")
    }
}

Now using, UIView.animation closure:

UIView.animate(withDuration: 0.5, animations: { 
      button.transform = CGAffineTransform(rotationAngle: (CGFloat(Double.pi))) 
}) { (isAnimationComplete) in
    // Animation completed 
}

rotate 180 degree for an UIImageView, and rotate back with same route

9 Answers9

Swift 5