wix-incubator / react-native-keyboard-input

Use your own custom input component instead of the system keyboard
MIT License
819 stars 150 forks source link

When used with React Navigation, there is gap between keyboard and renderContent. #80

Open aksmfosef11 opened 5 years ago

aksmfosef11 commented 5 years ago

When loading the first page, nothing is wrong. However, if I go to another screen using navigate in ReactNavigation and then use goBack to return to the page with keyboard-input, there will be a gap between keyboard and renderContent.

firstLoading before

after goBack after

aksmfosef11 commented 5 years ago

Fixed by modifying KeyboardTrackingView in xcode. I do not know why, but after using goBack [notification.userInfo [UIKeyboardFrameEndUserInfoKey] CGRectValue]; return wrongValue

I Changed - (void)_keyboardWillChangeFrameNotification:(NSNotification*)notification to

- (void)_keyboardWillChangeFrameNotification:(NSNotification*)notification
{
    if(self.window)
    {
        return;
    }

    CGRect endFrame = [notification.userInfo[UIKeyboardFrameEndUserInfoKey] CGRectValue];
    CGRect beginFrame = [notification.userInfo[UIKeyboardFrameBeginUserInfoKey] CGRectValue];
    if (endFrame.origin.y > beginFrame.origin.y) {
        _keyboardHeight = [UIScreen mainScreen].bounds.size.height - endFrame.origin.y;
    }else {
        _keyboardHeight = [UIScreen mainScreen].bounds.size.height - beginFrame.origin.y;
    }

    [_delegate observingInputAccessoryViewDidChangeFrame:self];

    [self invalidateIntrinsicContentSize];
}

I hope this helps people with similar problems.

oferRounds commented 4 years ago

@aksmfosef11 seeing the same problem, and tried your solution, but the problem still persists. Any idea?

djorkaeffalexandre commented 4 years ago

This problem is related to Tracking the wrong TextInput, you need to reset Tracking when the screen get focus. To reset tracking you can use [self deferedInitializeAccessoryViewsAndHandleInsets];. Here you can see my solution: https://github.com/RocketChat/Rocket.Chat.ReactNative/pull/1784/files#diff-d2de66677f2f2938b364383a0eac5ab4R70, it's related to KeyboardTrackingView, not KeyboardInput, I think you can close this issue and open related on react-native-keyboard-tracking-view.

oferRounds commented 4 years ago

@djorkaeffalexandre thank you! Although not I understand, can you show how – where do I add this line? This seems related only to iOS