iosobjective-cfacebookanimationfacebook-pop

Animation of UILabel and UITextField (Facebook POP framework)


I'm using the Facebook POP framework to animate UILabels and UITextFields when the user entered a wrong input. I want to simulate the kind of spring animation when you enter the wrong password in on a mac.

I've writting this method for doing the shake animation:

- (void)shakeAnimation:(UITextField *)textField :(UILabel *)label
{
  //This method takes a textField and a label as input, and animates them accordingly. 
  //When the animation is done, the button is available for touch again, and the animation is removed.

  POPSpringAnimation *positionAnimation = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerPositionX];
  positionAnimation.springBounciness = 20; //just parameters, nothing fancy
  positionAnimation.velocity = @4000;
  [positionAnimation setCompletionBlock:^(POPAnimation *animation, BOOL finished) {
    self.signUpButton.userInteractionEnabled = YES;
  }];
  [textField.layer pop_addAnimation:positionAnimation forKey:@"positionAnimation"];
  [label.layer pop_addAnimation:positionAnimation forKey:@"positionAnimation"];
  [positionAnimation removedOnCompletion];

}

However, When I'm calling this method like so: [self shakeAnimation:self.emailField :self.emailLabel];

the UILabels only move about 50px to the right and then stop moving, whereas the UITextFields don't do anything. It doesn't seem like an animation at all, just an adjustment of the frame.


Solution

  • Instead of adding the same POPSpringAnimation to both the textField layer and the label layer, make two POPSpringAnimations and add one to each. Like this :

    POPSpringAnimation *anim1 = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerPositionX];
    anim1.springBounciness = 20; //just parameters, nothing fancy
    anim1.velocity = @400;
    [anim1 setCompletionBlock:^(POPAnimation *animation, BOOL finished) {
        self.button.userInteractionEnabled = YES;
    }];
    
    POPSpringAnimation *anim2 = [POPSpringAnimation animationWithPropertyNamed:kPOPLayerPositionX];
    anim2.springBounciness = 20; //just parameters, nothing fancy
    anim2.velocity = @400;
    
    [textField.layer pop_addAnimation:anim1 forKey:@"positionAnimation"];
    [label.layer pop_addAnimation:anim2 forKey:@"positionAnimation"];
    
    [anim1 removedOnCompletion];
    [anim2 removedOnCompletion];