Centrar Vista al Editar un campo UITextField ( iOS )

¿ Cómo podemos hacer para que cuando editamos un campo UITextField de nuestra vista, se desplace automáticamente la vista al aparecer el teclado ?

Por las definiciones que hagamos en nuestro código hemos de verificar antes de nada los siguientes puntos:

  • El fichero .h debe heredar de UIViewController y más concretamente también de UITextFieldDelegate. Ejemplo:
    @interface AuthenticationViewController : UIViewController <UITextFieldDelegate> {
    
  • Con dos sencillos booleanos declarados en el .h (keyboardShown y viewMoved) podremos controlar y conocer el estado de la vista
  • Declarar estos métodos en nuestro .m nos ayudará a hacer la faena sucia de mover la vista:
    - (void)keyboardWasShown:(NSNotification *)aNotification {
    if ( keyboardShown )
    return;
    NSDictionary *info = [aNotification userInfo];
    NSValue *aValue = [info objectForKey:UIKeyboardFrameEndUserInfoKey];
    CGSize keyboardSize = [aValue CGRectValue].size;
    
    NSTimeInterval animationDuration = duration;
    CGRect frame = self.view.frame;
    frame.origin.y -= keyboardSize.height-offsetoriginy;
    frame.size.height += keyboardSize.height-offsetframeheight;
    [UIView beginAnimations:@"ResizeForKeyboard" context:nil];
    [UIView setAnimationDuration:animationDuration];
    self.view.frame = frame;
    [UIView commitAnimations];
    
    viewMoved = YES;
    
    keyboardShown = YES;
    }
    
    - (void)keyboardWasHidden:(NSNotification *)aNotification {
    if ( viewMoved ) {
    NSDictionary *info = [aNotification userInfo];
    NSValue *aValue = [info objectForKey:UIKeyboardFrameEndUserInfoKey];
    CGSize keyboardSize = [aValue CGRectValue].size;
    
    NSTimeInterval animationDuration = duration;
    CGRect frame = self.view.frame;
    frame.origin.y += keyboardSize.height-offsetoriginy;
    frame.size.height -= keyboardSize.height-offsetframeheight;
    [UIView beginAnimations:@"ResizeForKeyboard" context:nil];
    [UIView setAnimationDuration:animationDuration];
    self.view.frame = frame;
    [UIView commitAnimations];
    
    viewMoved = NO;
    }
    
    keyboardShown = NO;
    }
    

Ahora únicamente nos falta conseguir que los dos métodos que acabamos de crear (keyboardWasShown y keyboardWasHidden) sean llamados cuando sea pertitente, para ello lo que haremos será ampliar las notificaciones que se envían cuando se comienza a editar un input de ésta forma:

- (void)registerForKeyboardNotifications  {
    [[NSNotificationCenter defaultCenter] addObserver:self
                                selector:@selector(keyboardWasShown:)           
                                    name:UIKeyboardDidShowNotification 
                                  object:nil];
    [[NSNotificationCenter defaultCenter] addObserver:self
                                selector:@selector(keyboardWasHidden:)
                                    name:UIKeyboardDidHideNotification 
                                  object:nil];
}

A la vez, es importante que en init del ViewController o en el ViewDidLoad hagáis la llamada correspondiente a registerForKeyboardNotifications.

[self registerForKeyboardNotifications];

Con el objetivo de que queden las notificaciones añadidas a los eventos correspondientes.

Eso es todo, únicamente debéis jugar con los parámetros duration (float), offsetoriginy (int), offsetframeheight (int) hasta que el resultado visual sea el correcto 😉 Yo les he asignado los siguientes valores:

  • duration = 0.300000011920929 (duración de la animación)
  • offsetoriginy = 144
  • offsetframeheight = 44

Leave a Reply

Your email address will not be published. Required fields are marked *