john bickers
john bickers

Reputation: 13

Move up elements when keyboard is raised

I am making a chat that functions similar to the one below:

enter image description here

When a user clicks the message bubble, I need it to raise both the UITextField AND the UITableView (with the table view above the text-box of course). And similarly, when they send or retract the message, it should go back down to what it was.

I tried the solution posted here

Two notifications:

[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillHideOrShow:) name:UIKeyboardWillHideNotification object:nil];
[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillHideOrShow:) name:UIKeyboardWillShowNotification object:nil];

And the actual function:

- (void)keyboardWillHideOrShow:(NSNotification *)note
{
    NSDictionary *userInfo = note.userInfo;
    NSTimeInterval duration = [[userInfo objectForKey:UIKeyboardAnimationDurationUserInfoKey] doubleValue];
    UIViewAnimationCurve curve = [[userInfo objectForKey:UIKeyboardAnimationCurveUserInfoKey] intValue];

    CGRect keyboardFrame = [[userInfo objectForKey:UIKeyboardFrameEndUserInfoKey] CGRectValue];
    CGRect keyboardFrameForTextField = [self.myTextField.superview convertRect:keyboardFrame fromView:nil];

    CGRect newTextFieldFrame = self.myTextField.frame;
    newTextFieldFrame.origin.y = keyboardFrameForTextField.origin.y - newTextFieldFrame.size.height;

    [UIView animateWithDuration:duration delay:0 options:UIViewAnimationOptionBeginFromCurrentState | curve animations:^{
        self.myTextField.frame = newTextFieldFrame;
    } completion:nil];
}

But it has two problems:

  1. I'm not sure how to raise the tableview on top of the keyboard
  2. When the keyboard goes back down, the input box disappears entirely.

Upvotes: 1

Views: 610

Answers (1)

Dana K
Dana K

Reputation: 380

This might help....Cant take credit for it but for the life of me I cant remember where it came from...helped me with a project at one point though so this is how I used it.

This will move the view up and down when the keyboard is called/dismissed based on a BOOL value YES or NO. This way also allows you to have a bit more control over other aspects of it.

- (void) animateTextField: (UITextField*) textField up: (BOOL)up
{
const int movementDistance = 100;
const float movementDuration = 0.3f;
int movement = (up ? -movementDistance : movementDistance);

[UIView beginAnimations: @"anim" context: nil];
[UIView setAnimationBeginsFromCurrentState: YES];
[UIView setAnimationDuration: movementDuration];
self.view.frame = CGRectOffset(self.view.frame, 0, movement);
[UIView commitAnimations];
}

And then to implement it:

-(IBAction)goingup:(id)sender
{
   //Bounces the text field up for editing
   [self animateTextField: yourtextfield up: YES];} 
}


-(IBAction)backdown:(id)sender
{
   //Bounces it back when keyboard is dismissed 
   [self animateTextField: yourtextfield up: NO];   
}

Connect the actions to your text fields Editing did begin and Editing did end outlets and you're set.

Hope that helps.

Upvotes: 2

Related Questions