1.0.3 • Published 3 years ago

rn-password-field v1.0.3

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

rn-password-field

Customizable react native password field with visibility eye icon. output

Installation

$ npm install --save rn-password-field

Usage

 import Formfield from 'rn-password-field'; 

Use Formfield component tag along with properties as below.

<Formfield placeholder='Password' ispassword={true}/>

You can also use the same component for plain text field by setting ispassword to false

<Formfield placeholder='Username' lablevalue='Joan' ispassword={false}/>

Properties

propsvaluerequireddefault value
placeholderStringNoNull
lablevalueStringNoNull
ispasswordboolYesNull
stylestyleNo

Example:

import React, {useState} from 'react'
import { View, Button } from 'react-native'
import Formfield from 'rn-password-field';

export default function login(){
    const [username, setUsername] = useState('')
    const [password, setPassword] = useState('')
    
    const onLoginPress = () =>{
        //your code for login action
    }
    
    return(
        <View>
                <Formfield onChangeText={e=>{setUsername(e)}}  placeholder='Email Id / Phone number' lablevalue={username} ispassword={false}/>
                <Formfield onChangeText={e=>{setPassword(e)}} placeholder='Password' lablevalue={password} ispassword={true}/>
                <Button onPress={onLoginPress} title="Login" />
        </View>
    )
}

Output:

output output output