react-native-awesome-text-input

react-native-awesome-text-input

A simple lib to share an easy to implement animated custom text input for React native

How to install

With npm: npm i react-native-awesome-text-input

With yarn: yarn add react-native-awesome-text-input

Examples

Simple label input

import { AwesomeTextInput } from 'react-native-awesome-text-input';

export default function App() {
  return (
    <AwesomeTextInput label="Simple label" />
  );
}

Password input

import { AwesomeTextInput } from 'react-native-awesome-text-input';

export default function App() {
  return (
    <AwesomeTextInput label="Password" secureTextEntry={true} />
  );
}

All round bordered input

import { AwesomeTextInput } from 'react-native-awesome-text-input';

export default function App() {
  return (
    <AwesomeTextInput 
      label="Bordered input" 
      customStyles={{ 
        container: { 
          borderWidth: 1, 
          borderColor: 'grey', 
          borderRadius: 10 
        }, 
        title: { 
          backgroundColor: "white" 
        } 
      }} />
  );
}

API

Prop	Values	Example
label	string	Example label
customStyles	{ container?: ReactNative.ViewStyle, title?: ReactNative.TextStyle, inputContainer?: ReactNative.ViewStyle }	{ container: { borderRadius: 5, backgroundColor: 'purple' } , title: { color: "white" }, inputContainer: { backgroundColor: 'blue' } }
...any ReactNative.TextInput props	ReactNative.TextInput props	secureTextEntry: true // Hide the text input for passwords

Are pull requests and feature requests welcomed?

For sure! Don't hesitate to open issues with the enhancement tag or open pull requests for bugfixes/enhancements.