React-native-keyboard-aware-scroll-view: extraScrollHeight cause bottom empty space

[andrej-kuznetsov]

I have bottom empty space, it cause extraScrollHeight

"react-native-keyboard-aware-scroll-view": "^0.8.0",
"react-native": "0.55.4",

My code

<KeyboardAwareScrollView
    style={ { flex: 1 } }
    extraScrollHeight={ this.props.extraScrollHeight }
    keyboardShouldPersistTaps='handled'
    contentContainerStyle={ { width: responsiveWidth(100) } }
    enableOnAndroid
>
// CONTENT
</KeyboardAwareScrollView>

[andrej-kuznetsov]

In case double tap for hiding keyboard

[andrej-kuznetsov]

For me, the quickest fix is to pass scrollEnabled={ false }.But it forbid user to scroll, it just suitable fix for my case, and it isn't properly way of fixing this bug.

[mdnahian]

any update on this?

[SaltySammy]

I don't think it's related to extraScrollHeight I've got this problem without the extraScrollHeight property.

[OsamaSaleem95]

same problem here

[4t4sh]

Any solution for this problem? Here, the same problem :(

[DIMASIK1502]

The library adds padding. I just edit that lines in render method(KeyboardAwareHOC.js), it solved my problem. But this is not the best way.

 if (Platform.OS === 'android' && enableOnAndroid) {
        newContentContainerStyle = [].concat(contentContainerStyle).concat({
          paddingBottom:
            ((contentContainerStyle || {}).paddingBottom || 0) +
            this.state.keyboardSpace
        })
      }

to

 if (Platform.OS === 'android' && enableOnAndroid) {
        newContentContainerStyle = [].concat(contentContainerStyle).concat({
          paddingBottom:
            ((contentContainerStyle || {}).paddingBottom || 0)
        })
      }

[duyenhang]

You don't need change in Lib, you can add this line to KeyboardAwareFlatList
contentContainerStyle={Platform.OS == 'android' ? { paddingBottom: -this.state.keyboardHeight } : {}}

[jsam6]

Any solution found yet?

I've been experiencing this issue on android. Nothing to do with scrollHeight but it only happens when i add enableOnAndroid={true}

[jsam6]

I've found the solution for this problem (at least for my case).

I added style = {{ flex: 1, minHeight: Dimensions.get('window').height }} to KeyboardAwareScrollView.

[dkoprowski]

I've the same issue. Both iOS & Android are affected.

[jsam6]

@dkoprowski try using native-base instead

import { Content } from 'native-base';

<Content extraScrollHeight={heightofkeyboard}  enableOnAndroid>
// children
</Content>

[darkhorse-coder]

In ScrollView, flex properties will be applied by contentContainerStyle.

<KeyboardAwareScrollView
        contentContainerStyle={{flex: 1}}
>

It will help you.

[devinjameson]

Maybe this will help: https://github.com/APSL/react-native-keyboard-aware-scroll-view/issues/289#issuecomment-777094398

[raffibag]

In ScrollView, flex properties will be applied by contentContainerStyle.

<KeyboardAwareScrollView
        contentContainerStyle={{flex: 1}}
>

It will help you.

Worked perfectly for me. Not sure why it got two thumbs down...