A customized react-native TextInput using react-native-animatable
$ npm i --save react-native-input-outline
or
$ yarn add react-native-input-outline
This component inherits props from TextInput in the standard React-Native library, so you can essentially use it in the same way that you would use that TextInput. However, you can configure the colors, and the placeholder, and the overall styling if you wish, however the whole point of this component is so you don't have to do any styling yourself.
import InputOutline from 'react-native-input-outline';
<InputOutline
placeholder="Email"
focusedColor='blue'
defaultColor='grey'
/>
Prop | Description | Default |
---|---|---|
Inherited Props | Any prop from React-Native TextInput | TextInput Props |
placeholder | The label/placeholder that will display giving information about your input field. | String("Placeholder") |
focusedColor | The color that shows when the input is focused. | String("blue") |
defaultColor | The color that shows when the input is empty and not focused. | String("#c5b4b8") |