1

I have created a log in page for an application I am working on. When the user taps the text field and the keyboard pops up I would like the text fields (password and email) as well as the log in button to move up. Right now when the keyboard pops up it blocks the log in button. I would like it to move up when the keyboard moves up. A perfect example of what I would like to do can be seen, in the Facebook messenger apps log in screen.

rmaddy
  • 298,130
  • 40
  • 468
  • 517
user3413380
  • 75
  • 11
  • possible duplicate of [How to make a UITextField move up when keyboard is present](http://stackoverflow.com/questions/1126726/how-to-make-a-uitextfield-move-up-when-keyboard-is-present) – klcjr89 Jul 16 '14 at 22:36

3 Answers3

0

Put them in a parent UIView, then use an animation -- something like this:

- (void) keyboardDidShow:(id) sender
{
    CGAffineTransform myTransform = CGAffineTransformMakeTranslation(-450.0f, 0.0f);

    [UIView animateWithDuration:0.50f
                 animations:^(void){ myView.transform = myTransform; }
                     completion:^(BOOL finished) {  } ];
}

This will cause the entire view to move up on the screen by 450. Then, you just need a couple of notifications set up to trigger the animation(s) (you'll also need one to animate back into place when the keyboard goes away).

    [[UIDevice currentDevice] beginGeneratingDeviceOrientationNotifications];
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardDidShow:) name:UIKeyboardDidShowNotification object:nil];
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardDidHide:) name:UIKeyboardDidHideNotification object:nil];
RegularExpression
  • 3,473
  • 2
  • 23
  • 34
0

You want to position the UIViewController.view.frame up the amount of space that the keyboard takes up. There are a couple of steps to do this smoothly. Here is some sample code.

- (void)viewDidLoad
{
    [super viewDidLoad];

    // listen for keyboard display so we can adjust the view accordingly
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillShow:) name:UIKeyboardWillShowNotification object:nil];
    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillHide:) name:UIKeyboardWillHideNotification object:nil];
}

- (void)keyboardWillShow:(NSNotification *)notification
{
    // move the view up so that the login button is 8 points above the keyboard
    [self adjustScreenForKeyboard:notification target:self.loginButton offset:8.0f];
}

- (void)keyboardWillHide:(NSNotification *)notification
{
    // move the view back down to its original position
    [self adjustScreenForKeyboard:notification target:nil offset:0];
}

- (void)adjustScreenForKeyboard:(NSNotification *)notification target:(UIView *)target offset:(CGFloat)offset
{
    CGFloat yPos = 0;

    if (notification.name == UIKeyboardWillShowNotification) {
        // calculate how much we have to move the screen to bring the target into view
        CGSize keyboardSize = [[[notification userInfo] objectForKey:UIKeyboardFrameBeginUserInfoKey] CGRectValue].size;
        CGFloat screenOverlap = self.view.frame.size.height - keyboardSize.height;
        CGFloat targetY = (target.frame.origin.y + target.frame.size.height + offset);

        // only set the offset if the target is actually hidden
        yPos = targetY > screenOverlap ? screenOverlap - targetY : 0;
    }
    else if (notification.name == UIKeyboardWillHideNotification) {
        // set back to original position
        yPos = 0;
    }
    else {
        // unknown notification type - do nothing
        return;
    }

    NSTimeInterval keyboardAnimationDuration = [[[notification userInfo] objectForKey:UIKeyboardAnimationDurationUserInfoKey] doubleValue];

    if (self.view.frame.origin.y == yPos) {
        return;
    }

    // slide the view up/down to coincide with the keyboard slide
    [UIView animateWithDuration:duration animations:^{
        CGRect frame = self.view.frame;
        frame.origin.y = yPos;
        self.view.frame = frame;
    }];

}

Here are a couple of key points to take into consideration:

  • You really only want to slide the screen up enough to show your bottom field (e.g. login button) not necessarily the height of the keyboard itself. This is going to be a different amount depending on the screen (iphone5, iphone4, ipad).
  • The keyboard height can be different depending on the language so you want to detect this dynamically not hardcode it like some other examples do.
  • You want to animate the slide effect to coincide with the keyboard slide so that it is smooth.

Hope that helps.

xsee
  • 1,163
  • 1
  • 9
  • 11
0

I had this problem before and solved it another way. I would suggest using a UITableview to populate the table cells with your form. And then when the user clicks on one of the text fields and the keyboard pops up, the UITableview automatically pushes that cell up to where it is visible. Try it out!

This solution would involve no coding to move the cell up. All you would then have to focus on is the visual aspect of that tableview.

vnchopra
  • 139
  • 10