CODEWITHSUNDEEP
react-nativekeyboardkeyboard-avoidance
user18899735
user18899735

Reputation:

KeyBoardAvoidingView not Doing anything

I am using <KeyboardAvoidingView/> to try to create a messaging interface in React Native wherein upon entering the text field, the field raises up so the user can see what they're typing. I have the following syntax...

<Gradient
colorOne={COLORS.gradientColor1}
colorTwo={COLORS.gradientColor2}
style={{width: maxWidth * 1.00, height: '100%'}}
>
  <KeyboardAvoidingView
  behavior="padding"
  enabled
  style={{flexGrow:1}}
  >
    {renderHeader()}
    {MainRender()}
  </KeyboardAvoidingView>
</Gradient>

However, in execution, the following occurs... enter image description here

enter image description here

Upvotes: 0

Views: 85

Answers (1)

Nightcrawler
Nightcrawler

Reputation: 1081

You can try install react-native-keyboard-aware-scroll-view package and use it in your code like this:

 <KeyboardAwareScrollView 
   enableAutomaticScroll={false}  
   bounces={false} 
   enableOnAndroid         
   keyboardShouldPersistTaps='handled'>
    {content}
 </KeyboardAwareScrollView>

Hope this will help you.

Upvotes: 0

Related Questions