🥳 Version 4

Version 4 with the completely new UI

• Whole new UI / UX
• Simplistic Design
• Better Code Quality
• Fully Customizable
• Ready to use SocialButton Component
• Removed unstable dependencies
• Only ONE dependency is needed

Installation

Add the dependency:

npm i react-native-login-screen

Peer Dependencies

IMPORTANT! You need install them.

npm i react-native-text-input-interactive

"react-native-text-input-interactive": ">= 0.1.3"

Import

import LoginScreen from "react-native-login-screen";

Usage

<LoginScreen
  logoImageSource={require("./assets/logo-example.png")}
  onLoginPress={() => {}}
  onSignupPress={() => {}}
  onEmailChange={(email: string) => {}}
  onPasswordChange={(password: string) => {}}
/>

Usage with Social Button

Of course you can put any children into the LoginScreen, I recommend you to use SocialButton.

import LoginScreen, { SocialButton } from "react-native-login-screen";

<LoginScreen
  logoImageSource={require("./assets/logo-example.png")}
  onLoginPress={() => {}}
  onSignupPress={() => {}}
  onEmailChange={(email: string) => {}}
  onPasswordChange={(password: string) => {}}
>
  <SocialButton text="Continue with Google" onPress={() => {}} />
  <SocialButton
    text="Continue with Facebook"
    imageSource={require("./assets/social/facebook.png")}
    onPress={() => {}}
  />
  <SocialButton
    text="Continue with Twitter"
    imageSource={require("./assets/social/twitter.png")}
    onPress={() => {}}
  />
</LoginScreen>;

Configuration - Props

Fundamentals

Customizations (Optional)

Default Social Login Buttons (Optional)

Version 2 is still available

if you do not like the new design, you can still use the old design :)

npm i [email protected]

Roadmap

• [x] ~~LICENSE~~
• [x] ~~Android Design Bug Fixes~~
• [x] ~~Configuration - Props COMING SOON~~
• [x] ~~Typescript Challenge!~~
• [x] ~~Remove some dependencies~~
• [x] ~~Better TextField Library Integration~~
• [ ] Write an article about the lib on Medium
• [ ] Write an article about the lib on DevTO

Credits

For the awesome photo thanks to jcob nasyr from Unsplash

Author

FreakyCoder, [email protected]

License

React Native Login Screen is available under the MIT license. See the LICENSE file for more info.