Geek Answers Handbook

Autolayout breaks translation rotation animation

I have a UIView, I want to animate it using rotation. I also want to use autorun. I have already seen many common stackoverflow questions, but I have not found a suitable solution. So, start with my interface and animation code; I have a UIView with an image that needs to be rotated. And right now I have a button that activates the rotation. In the screenshot you can see the red cross, it should be the center of rotation (right now in the image, but I want to make the center of rotation outside the rotated UIView, I know that this can be archived using AnchorPoint).

enter image description here

This is my rotation animation code:

#define ROTATE_DURATION 3.0

- (IBAction)rotateArrow {

CGAffineTransform transform = self.hand.transform;

NSLog(@"layer possition before animation x: %f; y: %f",self.hand.layer.position.x,self.hand.layer.position.y);

[UIView animateWithDuration:ROTATE_DURATION/3 delay:0.0 options:UIViewAnimationOptionCurveLinear animations:^{

        self.hand.transform = CGAffineTransformRotate(transform, 2*M_PI/3) ;
        [self.hand layoutIfNeeded];

        NSLog(@"layer possition after animation 1 x: %f; y: %f",self.hand.layer.position.x,self.hand.layer.position.y);
     }
    completion:^(BOOL finished) {
        [UIView animateWithDuration:ROTATE_DURATION/3 delay:0.0 options:UIViewAnimationOptionCurveLinear animations:^{

            self.hand.transform = CGAffineTransformRotate(transform, -2*M_PI/3) ;
            [self.hand layoutIfNeeded];

            NSLog(@"layer possition after animation 2 x: %f; y: %f",self.hand.layer.position.x,self.hand.layer.position.y);
        }
    completion:^(BOOL finished) {
        [UIView animateWithDuration:ROTATE_DURATION/3 delay:0.0 options:UIViewAnimationOptionCurveLinear animations:^{

            self.hand.transform = CGAffineTransformRotate(transform, 0) ;
            [self.hand layoutIfNeeded];

            NSLog(@"layer possition after animation 3 x: %f; y: %f",self.hand.layer.position.x,self.hand.layer.position.y);
        }
        completion:^(BOOL finished) {

        }];
    }];
}];



}

, : , UIView center layer.position, UIView "" . , . WWDC 2012 " " , [self.hand layoutIfNeeded];, , . , , "". , "".

enter image description here

, UIView , , . ""?

:

 layer possition before animation x: 160.000000; y: 99.500000
 layer possition after animation 1 x: 197.349030; y: 114.309601
 layer possition after animation 2 x: 197.349030; y: 114.309601
 layer possition after animation 3 x: 160.000000; y: 99.500000

.

+4
3

, . , , , , , .

+2
  • , .
  • ( , )    .
  • .

:

// Create container view
{
    self.mContainerView = [[UIView alloc] init];
    self.mContainerView.translatesAutoresizingMaskIntoConstraints = NO;
}

// Create view who will have the transform 
{
    self.mRotateView = [UIButton buttonWithType:UIButtonTypeCustom];
    self.mRotateView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;        
        [self.mContainerView addSubview:self.mRotateView];
}

:

{
    CGFloat lAngle = 180.0;    
    [UIView animateWithDuration:0.5 delay:0.0 options: UIViewAnimationOptionAllowUserInteraction |UIViewAnimationOptionCurveLinear animations:^{
            CGAffineTransform transform = CGAffineTransformMakeRotation(lAngle);
            self.mRotateView.transform = transform;
        } completion:NULL];
}
+1

More articles:


All Articles