Both support android and ios
$ npm install react-native-avoiding-keyboard-scroll-view --save
- Insert the following lines inside in
AndroidManifest.xml
:
if you want set another mode in different Scenes, you can set properties dynamically in native<activity android:windowSoftInputMode="stateAlwaysHidden|adjustResize">
public void setAdjustPan() { runOnUiThread(new Runnable() { @Override public void run() { r.getCurrentActivity().getWindow() .setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_HIDDEN | WindowManager.LayoutParams.SOFT_INPUT_ADJUST_PAN); } }); }
import { KeyboardScrollView } from 'react-native-avoiding-keyboard-scroll-view'
// TODO: What to do with the module?
class A extends Component{
render(){
return (
<KeyboardScrollView
keyboardViewOffset={30}
renderBottomComponent={() => <View/>}
>
// your layout
</KeyboardScrollView>
)
}
}
All the ScrollView props will be passed.
Props | Type | required | description |
---|---|---|---|
containerStyle | ViewStyle | no | style of container |
bottomContainerStyle | ViewStyle | no | style of then fixed bottom |
keyboardViewOffset | number | no | distance between keyboard and TexInput |
renderBottomComponent | Function | no | the component of fixed bottom |
scrollRef | ref | no | ref of scroll view |