Iphone-How do I get an image to rotate continously for about 60 seconds and then stop in the other direction

Question

I need the image to spin around a few times and come to a stop in the opposite dirrection. THe image is a button with arrow that points right and then it spins a few times and comes to a stop facing the other way. Any help will be appreciated. This is what I have at the moment.

CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"];
  animation.duration = 0.60;//animation.duration = 0.60;
  animation.repeatCount = 1;//animation.repeatCount = 1000ˆ

//#warning remove comment brackets below

  animation.keyTimes = [NSArray arrayWithObjects:
                        [NSNumber numberWithFloat:0.0],
                        [NSNumber numberWithFloat:1.0], nil];

  animation.values = [NSArray arrayWithObjects:
                      [NSNumber numberWithFloat:0.0],
                      [NSNumber numberWithFloat:(degrees / 180)*M_PI], nil];

  animation.fillMode = kCAFillModeForwards;

Answer 1

Please try this and let me know. This is working for me.

UIImageView *tempView = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 80, 80)];
    tempView.image = [UIImage imageNamed:@"Icon"];
    tempView.backgroundColor = [UIColor redColor];
    [self.view addSubview:tempView];

    const NSUInteger rotations = 10;
    const NSTimeInterval duration  = 5;

    CAKeyframeAnimation *anim = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation"];
    CGFloat touchUpStartAngle = 0;
    CGFloat touchUpEndAngle = (M_PI);
    CGFloat angularVelocity = (((2 * M_PI) * rotations) + M_PI) / duration;
    anim.values = @[@(touchUpStartAngle), @(touchUpStartAngle + angularVelocity * duration)];
    anim.duration = duration;
    anim.autoreverses = NO;
    anim.delegate = self;
    anim.repeatCount = 1;
    anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    [tempView.layer addAnimation:anim forKey:@"test"];

    tempView.transform = CGAffineTransformMakeRotation(touchUpStartAngle + (touchUpEndAngle));

Answer 2

The following code works for me. It actually doesn´t change the direction. I think you can achieve this by adding a timer which change the imagesArray. First I also tried using CAKeyframeAnimation like you but I couldn´t figure it out. So I changed to an animating image - I thought this way couldn´t be too bad, because Apple eg use this way also for animating the activity indicator.

-(void) myImageInitFunction {
    UIImage *icon = [UIImage imageNamed:@"yourIconImage"];
    NSArray *imagesArray = rotatingImagesArrayOfImage(icon, 30);
    myImageViewThatShouldRotate.animationImages = imageArray;
    myImageViewThatShouldRotate.animationDuration= 2.0;
    [myImageViewThatShouldRotate startAnimating];
}

NSArray *rotatingImagesArrayOfImage(UIImage * icon, NSInteger nFrames)
{
    NSMutableArray *images = [NSMutableArray arrayWithObject:icon];

    for (NSInteger nLoop = 1; nLoop < nFrames; nLoop++) {
            [images addObject: [UIImage imageWithCGImage: CGImageRotatedByAngle(icon.CGImage, nLoop * ( 360 / nFrames)) ] ];
    }
    return images;
}

CGImageRef CGImageRotatedByAngle(CGImageRef imgRef,  CGFloat angle) {
    CGFloat angleInRadians = angle * (M_PI / 180);
    CGFloat width = CGImageGetWidth(imgRef);
    CGFloat height = CGImageGetHeight(imgRef);

    CGRect imgRect = CGRectMake(0, 0, width, height);
    CGAffineTransform transform = CGAffineTransformMakeRotation(angleInRadians);
    CGRect rotatedRect = CGRectApplyAffineTransform(imgRect, transform);

    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();

    CGContextRef bmContext = CGBitmapContextCreate(NULL,
                                               rotatedRect.size.width,
                                               rotatedRect.size.height,
                                               8,
                                               0,
                                               colorSpace,
                                               kCGImageAlphaPremultipliedFirst);
    CGContextSetAllowsAntialiasing(bmContext, YES);
    CGContextSetShouldAntialias(bmContext, YES);
    CGContextSetInterpolationQuality(bmContext, kCGInterpolationHigh);
    CGColorSpaceRelease(colorSpace);
    CGContextTranslateCTM(bmContext,
                      +(rotatedRect.size.width/2),
                      +(rotatedRect.size.height/2));
    CGContextRotateCTM(bmContext, angleInRadians);
    CGContextTranslateCTM(bmContext,
                      -(rotatedRect.size.width/2),
                      -(rotatedRect.size.height/2));
    CGContextDrawImage(bmContext, CGRectMake(0, 0,
                                         rotatedRect.size.width,
                                         rotatedRect.size.height),
                   imgRef);



    CGImageRef rotatedImage = CGBitmapContextCreateImage(bmContext);
    CFRelease(bmContext);

    return rotatedImage;
}

Answer 3

i use this:

- (void)startAnimations {

   CABasicAnimation* spinAnimation = [CABasicAnimation
                                   animationWithKeyPath:@"transform.rotation"];
   spinAnimation.toValue = [NSNumber numberWithFloat:M_PI];
   spinAnimation.cumulative = YES;
   spinAnimation.duration = 0.5;
   spinAnimation.repeatCount = 10000;
   [imageView.layer addAnimation:spinAnimation forKey:@"spinAnimation"];

}
- (void)cancelAnimations {

   [imageView.layer removeAnimationForKey:@"spinAnimation"];
   imageView.transform = CGAffineTransformMakeRotation(0.0);

}

call a timer in start animations to call cancelanimations in 60 secs. you can make rotation angle whatever you want

Answer 4

Thanks everyone this page is now very resourceful.

This is another solution.

- (CAKeyframeAnimation *)rotateFrom:(CGFloat)fromDegrees to:(CGFloat)toDegrees {
    CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"transform.rotation.z"];
    animation.delegate = self;
    animation.duration = 0.30;
    animation.repeatCount = 1;



    animation.keyTimes = [NSArray arrayWithObjects:
                          [NSNumber numberWithFloat:0.0],
                          [NSNumber numberWithFloat:1.0], nil];

    animation.values= [NSArray arrayWithObjects:
                       [NSNumber numberWithFloat:fromDegrees*(M_PI/180)],
                       [NSNumber numberWithFloat:toDegrees*(M_PI/180)], nil];

    animation.fillMode = kCAFillModeForwards;




    animation.removedOnCompletion = NO;


    return animation;


}