rn-login-screen

rn-login-screen A customizable login screen component for React Native projects. Use this open source library in your fresh React Native project for instant startup.

Table of Contents

Installation

To use rn-login-screen in your React Native project, simply install it using npm or yarn:

npm install rn-login-screen
or
yarn add rn-login-screen

Usage

To use the login screen component in your app, import it from the rn-login-screen package and render it as the second component in your app after splash screen. You can customize the appearance and behavior of the login screen by passing in props.

How to use

import LoginScreen from "rn-login-screen";

function App() {
  return (
    <LoginScreen
      placeholderMail={"Email"}
      placeholderPass={"Password"}
      headingText={"Login"}
      LoginSubmitText={"Login"}
      useLogo={true}
      useBg={true}
      LogoPosition={"center"}
      bgSource={require("./src/assets/black1.jpg")}
      source={require("./src/assets/cropped.png")}
      SignUpText={"Sign Up"}
      ForgotPasswordText={"Forgot Password"}
      positionText={"center"}
    />
  );
}

Props

The LoginScreen component accepts the following props:

Prop Name	Data Type	Description

placeholderMail	any	Your Email
placeholderPass	any	Your Password
---------	---------	-----------
placeholderColor	any	placeholder color
---------	---------	-----------
inputStyle	any	style to input
---------	---------	-----------
headingText	any	main heading
---------	---------	-----------
headingTextStyle	specified path(req)	style to heading
---------	---------	-----------
LoginSubmitText	any	Your Login Button text
---------	---------	-----------
useLogo	bool	Using Logo or not
---------	---------	-----------
LogoPosition	specified values	Logo position
---------	---------	-----------
bgSource	specified path(req)	Your background image
---------	---------	-----------
source	specified path(req)	Logo source
---------	---------	-----------
imageStyle	any	Style to Logo
---------	---------	-----------
SignUpText	any	Your SignUp Text
---------	---------	-----------
ForgotPasswordText	any	Your Forgot Password Text
---------	---------	-----------
positionText	specified values	Box alignment
---------	---------	-----------
loginPress	any	onPress for login
---------	---------	-----------
SignUpPress	any	onPress for signUp
---------	---------	-----------
onBlur	any	onBlur
---------	---------	-----------
onFocus	any	onFocus
---------	---------	-----------
onKeyPress	any	onKeyPress
---------	---------	-----------
keyboardType	any	keyboardType
---------	---------	-----------
ForgotPasswordPress	any	onPress for ForgotPasswordPress

Contributors

We would like to thank the following developers for their contributions to this project:

To all our contributors, thank you for your hard work and dedication!

License

This package is released under the MIT License.