React-native-gifted-chat: How to make header stick to screen when pressing "Type a message"

[meurling]

Issue Description

Right now my chat screen looks like this:

    <View style={{flex: 1}}>
        <Header {props...} />
        <GiftedChat {props...}/>
    </View>

When I press the "Type a message" bar at the bottom and the keyboard appears, my Header disappears, how do I make it stick?
I tried giving the header position: absolute, but it didn't help and also made the header un-clickable!

Thanks!

[zagoa]

Hello, did you find a solution ?

[meurling]

@zarnifoulette No, right now I have just accepted it, haven't had time to look into it anymore.
Would be great if someone had a solution! 🥇

[ddereszewski]

It will be great to be able to provide headerCompontent which will be displayed as a first element in the chat and be part of the message scroll

[DnEgorWeb]

I solved this problem replacing android:windowSoftInputMode="adjustPan" to android:windowSoftInputMode="adjustResize" in AndroidManifest.xml. Don't forget to rebuild your application after any changes in AndroidManifest.xml, cause your current build won't see the difference.

[nandiniparimi1107]

But what if other screens need adjust pan? I dont think its feasible to just change the manifest file

[Graymark]

Did someone find a solution to this issue?
I'm developping an app which is using react-native-gifted-chat and i have the same issue

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[msqar]

Any idea on how to solve this? This only happens on Android for me. I'm using NativeBase's header. Whenever the keyboard is opened, my entire header disappears because is being pushed to top lol.

[maxim-kushnarov-dev-optima]

Have the same issue, would be great to have a solution!

[msqar]

@maxim-kushnarov-dev-optima i fixed it by using adjustResize in AndroidManifest.xml, i had a wrong android:windowSoftInputMode

[maxim-kushnarov-dev-optima]

@msqar But it will accept adjustResize for all screens, or could we make it only for screen where we have a chat ?

[msqar]

@maxim-kushnarov-dev-optima unfortunately, nope. Although the best one to use is adjustResize otherwise it will push the content up, and that's pretty undesired.

[maxim-kushnarov-dev-optima]

@msqar Thanks, it was very helpful!

[c-jain]

I am also facing the same issue, would be great to have a solution!