where the keyboard height remains on the screen after hiding the keyboard

[sathyapriya31]

the keyboard remains visible or its height is retained when navigating away from the screen and then returning to it

[FILL THIS OUT]

Steps to Reproduce / Code Snippets

[FILL THIS OUT]

Expected Results

[FILL THIS OUT]

Additional Information

• Nodejs version: [FILL THIS OUT]
• React version: [FILL THIS OUT]
• React Native version: [FILL THIS OUT]
• react-native-gifted-chat version: [FILL THIS OUT]
• Platform(s) (iOS, Android, or both?): [FILL THIS OUT]
• TypeScript version: [FILL THIS OUT]

[sahilrathi01]

same did you fixed this?

[kasp416h]

Same here on android

[fukemy]

fast solution: catch onFocus screen event, before navigate/show modal -> hide keyboard first

[sahilrathi01]

keyboard is not getting visiiable

https://github.com/user-attachments/assets/12baa07f-e050-486a-880e-0a6b3fb45181

[mirsahib]

fast solution: catch onFocus screen event, before navigate/show modal -> hide keyboard first

can you please post some sample code i have been trying with this with no luck

const navigation = useNavigation();

  useEffect(() => {
    const unsubscribe = navigation.addListener('beforeRemove', () => {
      // Hide the keyboard just before leaving the screen
      Keyboard.dismiss();
      console.log('Keyboard dismissed');
    });

    return unsubscribe;
  }, [navigation]);

[fukemy]

fast solution: catch onFocus screen event, before navigate/show modal -> hide keyboard first

can you please post some sample code i have been trying with this with no luck

const navigation = useNavigation();

  useEffect(() => {

    const unsubscribe = navigation.addListener('beforeRemove', () => {

      // Hide the keyboard just before leaving the screen

      Keyboard.dismiss();

      console.log('Keyboard dismissed');

    });

    return unsubscribe;

  }, [navigation]);

dont do like that, before you navigate to new screen or show modal, lets check keyboard state first, hide it if showing, and navigate/show modal after delay ~250-300

[NiharR027]

+1 we are facing this issue as well

[Lil-Azurite]

this helped me (iOS)

if (Keyboard.isVisible()) {
  const onKeyboardDidHide = () => {
    Keyboard.removeAllListeners('keyboardDidHide');
    navigation.navigate('');
  };

  Keyboard.addListener('keyboardDidHide', onKeyboardDidHide);
  Keyboard.dismiss();
} else {
  navigation.navigate('');
}

[JatinjeetSingh12]

any solution?

[MGS-DEV]

Same problem! Hiding the keyboard when exiting the screen doesn't help.

[ngdbao]

no solution until now UI does not move down when keyboard hiding (only happens if I press onSend). Since tapping out to dismiss keyboard, it works fine

i have 2 apps One with Giftedchat nested inside bottom tabbar, problem occurs One without bottom tabbar, works fine. But I'm not sure that's the reason

[ngdbao]

i Think problem from useAnimatedKeyboard, this value stop tracking keyboard height after press onSend

[fukemy]

Use rn keyboard controller instead

[claudiozam]

In react-native-gifted-chat v2.4.1 no problem.