Not available on ios when using alignTop

[ysng007]

Issue Description

Not available on ios when using alignTop

Steps to Reproduce / Code Snippets

1. use alignTop: true, isKeyboardInternallyHandled: false

   <GiftedChat
               messages={messages}
               onSend={(messages) => onSend({ messages })}
               user={{
                   _id: 1
               }}
               // bottomOffset={100}
               alignTop
               renderAvatarOnTop
               alwaysShowSend
               renderInputToolbar={renderInputToolbar}
               renderComposer={renderComposer}
               renderSend={renderSend}
               renderAvatar={renderAvatar}
               renderBubble={renderBubble}
               renderSystemMessage={renderSystemMessage}
               // renderMessage={renderMessage}
               renderMessageText={renderMessageText}
               messagesContainerStyle={{ backgroundColor: 'indigo' }}
               renderQuickReplies={renderQuickReplies}
               minComposerHeight={Platform.OS === 'android' ? w(20) : w(14)}
               maxComposerHeight={Platform.OS === 'android' ? w(80) : w(64)}
               keyboardShouldPersistTaps="handled"
               onInputTextChanged={handleInteraction}
               onPress={handleInteraction}
               listViewProps={{
                   onScrollBeginDrag: handleInteraction,
                   // contentContainerStyle: { flexGrow: 1, justifyContent: 'flex-end' }
               }}
               scrollToBottom
               scrollToBottomStyle={styles.scrollToBottomStyle}
               scrollToBottomComponent={() => <Down width={w(24)} height={w(24)} />}
              //  isKeyboardInternallyHandled={false}
           />

https://github.com/FaridSafi/react-native-gifted-chat/assets/48479676/8dead0d2-837e-4a71-9868-ae475e1411f7

2. Replace alignTop with listViewProps={{ contentContainerStyle: { flexGrow: 1, justifyContent: 'flex-end' } }}

https://github.com/FaridSafi/react-native-gifted-chat/assets/48479676/279dc813-8711-443b-8b9a-32491e03a53b

3. set isKeyboardInternallyHandled: false

https://github.com/FaridSafi/react-native-gifted-chat/assets/48479676/4d3c0813-240d-46e7-a674-c7d50ee248dc

Expected Results

1. Hope to use alignTop: true, Ugly at the bottom of the page when saying hello
2. There is no gap between the keyboard and the input box

Additional Information

• Nodejs version: v18.0.0
• React version: 16.11.0
• React Native version: 0.62.3
• react-native-gifted-chat version: 2.4.0
• Platform(s) (iOS, Android, or both?): IOS
• TypeScript version:

[ysng007]

1. Modifying the code can solve the problem of some ios models(iphone 8, 16.1.2; iphone6s, 15.6.1,other versions not tested) GiftedChat.js

   if (maxHeightRef.current !== layout.height ||
           isFirstLayoutRef.current === true) {
   +               if (Platform.OS === 'android') {
                   maxHeightRef.current = layout.height;
                   setState({
                       ...state,
                       messagesContainerHeight: keyboardHeightRef.current > 0
                           ? getMessagesContainerHeightWithKeyboard()
                           : getBasicMessagesContainerHeight(),
                   });
   +               }
       }

2. On iphone6, 12.4.8, this bug persists and I can't find where the problem is

[jackieZou123]

So the problem solved？

[ysng007]

After searching for the reason for a few days, I found that the real reason is that there is code in the native iOS that handles the keyboard globally, and compatibility is sufficient in the native iOS code. There are no issues with this library itself.

[jackieZou123]

thanks. Could you tell me how to deal with this problem.I haven't found a way to solve this problem yet

[ysng007]

I'm not sure if your problem is the same as mine. I built a clean RN project and used GiftChat, which performed normally on iOS to eliminate RN issues. Then, I asked iOS native developers to check the problem and create a clean iOS project, which is also normal. So, let's continue to see if there are any configurations in the app. It took some time and he also found the problem. I'm only good at JS, this should not be difficult for iOS native developers. If you are not good at native development, you can seek help from other native developers.

[jackieZou123]

I'm just as good at JS, I don't know about IOS. I ran into this problem because I was using the web side in an RN environment，This problem is fine in the context of RN

[fukemy]

make a snack repo I can help u fix this