How can I keep iPhone Safari keyboard from scrolling a fixed navbar up?

Question

I'm building an app with PhoneGap and I have a screen that has a fixed navigation bar, a scrollable area below, and a text field in that area (think facebook message screen). When you tap on the text field, keyboard pops up and although nav bar is fixed, it scrolls up and out of the screen. I want it to stay fixed and scrollable area should get narrower.

Is there a way to do this?

Here's a diagram (sorry for poor quality): diagram

score 0 · Answer 1 · answered Dec 04 '12 at 12:27

0

set frames here:

- (void)textFieldDidBeginEditing:(UITextField *)textField
{
 // change base view frame
}
- (void)textFieldDidEndEditing:(UITextField *)textField
{
 // reset  base view frame
}

answered Dec 04 '12 at 12:27

NANNAV

4,875
4
32
50

Do I put this somewhere in the phonegap project? I am sorry I'm not really familiar with xcode but this looks like it deals with a native text field, am I right? I am using a webview for all these. – Faruk Can Bilir Dec 04 '12 at 12:41

score 0 · Answer 2 · edited May 23 '17 at 12:21

Rather than using C, just use javascript and window.scrollTo for this (on input focus)

$('input').live('focus', function(e) {
    e.preventDefault(); e.stopPropagation();
    window.scrollTo(0,0); //no scroll > stays fixed!
});

If you don't want to set a static value for the Y scroll position, feel free to use this short plugin I've written that automatically aligns the keyboard underneath the input field (unless there's no need to scroll). Just call this on focus as shown above:

setKeyboardPos(e.target.id);

How can I keep iPhone Safari keyboard from scrolling a fixed navbar up?

2 Answers2