React Native keyboard Moving View

!GitHub

Out-of-the-box alternative to KeyboardAvoidingView, that provides identical behavior on both iOS and Android, with more extra features.

Demonstration

$3

| Padding | Position |
| :------------------------------------------------------: | :-------------------------------------------------------: |
| | |

$3

| Padding | Position |
| :----------------------------------------------------------: | :-----------------------------------------------------------: |
| | |

Installation

``sh
yarn add react-native-keyboard-moving-view


OR


npm install react-native-keyboard-moving-view
`

#### IOS

`sh
cd ios && pod install
`

Usage

`js
import React from 'react';
import { SafeAreaView, TextInput, StyleSheet } from 'react-native';
import { KeyboardMovingView } from 'react-native-keyboard-moving-view';

export default function App() {
return (

style={styles.keyboardMovingView}
behavior="position"
extraHeight={25}
>



);
}

const styles = StyleSheet.create({
safeAreaView: { flex: 1 },
keyboardMovingView: { flex: 1 },
textInput: {
fontSize: 17,
height: 60,
width: '100%',
backgroundColor: '#EFEEEE',
borderRadius: 5,
paddingHorizontal: 15,
marginTop: 'auto',
},
});
`

Note: if you are using SafeAreaView component make sure to wrap it around the KeyboardMovingView component to work as expected in IOS like in the example above.

---

Props

| Name | Type | Default | Description |
| -------------------- | ----------------------- | ------- | ------------------------------------------------------------------------------------------------------------------ |
| behavior | padding OR position | null | Determines the behavior of the component when the keyboard is shown |
| extraHeight | number | 0 | Extra height between the keyboard and focused input(in position behavior) OR the content (in padding behavior) |
| onKeyboardWillShow | () => void | null | Called when the keyboard is about to be shown |
| onKeyboardWillHide | () => void | null | Called when the keyboard is about to be hidden |
| onKeyboardDidShow | () => void | null | Called when the keyboard is shown |
| onKeyboardDidHide | () => void | null` | Called when the keyboard is hidden |