floating-label-input-blufy

About

this is a floating Label input for react native that support ltr and rtl direction.you can check the demo below:

Installation

Use the package manager npm to install FloatingLabelInputBlufy.

npm i floating-label-input-blufy

Usage

import { FloatingLabelInput } from 'floating-label-input-blufy'

const app=()=>{

return(
<View>
 <FloatingLabelInput 
 fontSize={20} backgroundColor={Colors.Primary} 
 direction={'ltr'} title={'Username'}
 ContainerStyle={{marginTop:50}}>
 </FloatingLabelInput>
</View>);
}
export default app;

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Props

Prop	Type	Default	Description
backgroundColor	String	undefined	Color of Component Background
duration	Number	300	duration of animation
width	number	250	component's width
title	String	title	hint text
ContainerStyle	Object	undefined	Set styles to the input container component
fontSize	Number	18	hint and textinput font size
direction	'ltr'	'rtl'	'ltr'
font	Font	undefined	fontFamily of Component
isPassword	bool	false	change input type to password

License

MIT