react-native-keyboardshift-razzium

1.0.0 • Public • Published

react-native-KeyboardShift-razzium

A view (not a ScrollView !) component that handle keyboard display and prevent cover current focused input (based on John Tucker article : https://codeburst.io/react-native-keyboard-covering-inputs-72a9d3072689).",

GIF GIF

Installation

npm install react-native-KeyboardShift-razzium --save
or
yarn add react-native-KeyboardShift-razzium

Usage

import KeyboardShift from 'react-native-KeyboardShift-razzium';
 
// ...
 
render() {
    
  return (
    
     <KeyboardShift
        keyboardDisplayTopSpacing={10}
        animDuringKeyboardDisplayIOS={false} >
        {() => (
            <View style={styles.rootContainer}>
                <Text>
                react-native-KeyboardShift-razzium
                </Text>
            </View>
        )}
     </KeyboardShift>
            
  );
  
}

Props

Property Type isRequired? Default Description
animDuringKeyboardDisplayIOS bool optional FALSE Launch anim during keyboard display, not after display (iOS ONLY)
keyboardShowDisplayDuration number optional 250 Animation show during time
keyboardHideDisplayDuration number optional 250 Animation hide during time
keyboardDisplayTopSpacing number optional 0 Top spacing above keyboard (under input)

Credits

https://codeburst.io/react-native-keyboard-covering-inputs-72a9d3072689

License

MIT

Readme

Keywords

Package Sidebar

Install

npm i react-native-keyboardshift-razzium

Weekly Downloads

1

Version

1.0.0

License

MIT

Unpacked Size

16.6 kB

Total Files

8

Last publish

Collaborators

  • razzium