UIView to make an arm wave

Question

I'm trying to make an arm wave effect (Hello!) with UIView animations, but it snaps back to the beginning when the last one goes off. I want the wave to go back and forth.

First keyframe: Rotation 30˚ Second keyframe: Rotation -30˚ Third keyframe: SHOULD BE Rotation 0˚

    arm.layer.anchorPoint = CGPointMake(1.0, 1.0);
    float x = arm.frame.origin.x + arm.frame.size.width;
    float y = arm.frame.origin.y + arm.frame.size.height;
    arm.layer.frame = CGRectMake(x, y, arm.frame.size.width, arm.frame.size.height);
    [self.scrollView arm];


    float degrees = 30.0;
    float radians = (degrees/90.0)*M_PI;
    [UIView animateKeyframesWithDuration:4.0f delay:0.0 options:UIViewKeyframeAnimationOptionRepeat
    animations:^{            
        [UIView addKeyframeWithRelativeStartTime:0 relativeDuration:.5 animations:^{
            arm.transform = CGAffineTransformMakeRotation(radians);
        }];
        [UIView addKeyframeWithRelativeStartTime:.5 relativeDuration:.75 animations:^{
            arm.transform = CGAffineTransformMakeRotation(-radians);
        }];
        [UIView addKeyframeWithRelativeStartTime:1.25 relativeDuration:.5 animations:^{
            arm.transform = CGAffineTransformMakeRotation(0);
        }];

Answer 1

The reason is that you used up the whole animation on the first two frames of the keyframe animation. These are relative times and relative durations; they must all be less than 1!

So, on the first one you use up half the animation ( .5 ).

On the second one you start halfway through the animation ( .5 ) and then you use up the entire rest of the animation ( .75 is larger than .5 which is all you've got left).

So the third one never happens. And in any case it's completely nuts: you can't have a relative start time of 1.75 because 1 is the end of the animation. Read the docs:

This value must be in the range 0 to 1, where 0 represents the start of the overall animation and 1 represents the end of the overall animation. For example, for an animation that is two seconds in duration, specifying a start time of 0.5 causes the animations to begin executing one second after the start of the overall animation.