Provides login screen with login/signup functionalities to help speed up development

Overview

Flutter Login

FlutterLogin is a ready-made login/signup widget with many animation effects to demonstrate the capabilities of Flutter

Installation

Follow the install instructions here

Reference

Property Type Desciption
onSignup AuthCallback Called when the user hit the submit button when in sign up mode
onLogin AuthCallback Called when the user hit the submit button when in login mode
onRecoverPassword RecoverCallback Called when the user hit the submit button when in recover password mode
title String The large text above the login [Card], usually the app or company name. Leave the string empty or null if you want no title.
logo String The path to the asset image that will be passed to the Image.asset()
messages LoginMessages Describes all of the labels, text hints, button texts and other auth descriptions
theme LoginTheme FlutterLogin's theme. If not specified, it will use the default theme as shown in the demo gifs and use the colorsheme in the closest Theme widget
emailValidator FormFieldValidator<String> Email validating logic, Returns an error string to display if the input is invalid, or null otherwise
passwordValidator FormFieldValidator<String> Same as emailValidator but for password
onSubmitAnimationCompleted Function Called after the submit animation's completed. Put your route transition logic here
logoTag String Hero tag for logo image. If not specified, it will simply fade out when changing route
titleTag String Hero tag for title text. Need to specify LoginTheme.beforeHeroFontSize and LoginTheme.afterHeroFontSize if you want different font size before and after hero animation
showDebugButtons bool Display the debug buttons to quickly forward/reverse login animations. In release mode, this will be overrided to false regardless of the value passed in
hideForgotPasswordButton bool Hides the Forgot Password button if set to true
hideSignUpButton bool Hides the SignUp button if set to true

NOTE: It is recommended that the child widget of the Hero widget should be the same in both places. For title's hero animation use the LoginThemeHelper.loginTextStyle in the next screen to get the style of the exact text widget in the login screen. LoginThemeHelper can be accessed by adding this line

import 'package:flutter_login/theme.dart';

LoginMessages

Property Type Desciption
usernameHint String Hint text of the user name [TextField]
passwordHint String Hint text of the password [TextField]
confirmPasswordHint String Hint text of the confirm password [TextField]
forgotPasswordButton String Forgot password button's label
loginButton String Login button's label
signupButton String Signup button's label
recoverPasswordButton String Recover password button's label
recoverPasswordIntro String Intro in password recovery form
recoverPasswordDescription String Description in password recovery form
goBackButton String Go back button's label. Go back button is used to go back to to login/signup form from the recover password form
confirmPasswordError String The error message to show when the confirm password not match with the original password
recoverPasswordSuccess String The success message to show after submitting recover password
flushbarTitleError String The Flushbar title on errors
flushbarTitleSuccess String The Flushbar title on sucesses

LoginTheme

Property Type Desciption
primaryColor Color The background color of major parts of the widget like the login screen and buttons
accentColor Color The secondary color, used for title text color, loading icon, etc. Should be contrast with the [primaryColor]
errorColor Color The color to use for [TextField] input validation errors
cardTheme CardTheme The colors and styles used to render auth [Card]
inputTheme InputDecorationTheme Defines the appearance of all [TextField]s
buttonTheme LoginButtonTheme A theme for customizing the shape, elevation, and color of the submit button
titleStyle TextStyle Text style for the big title
bodyStyle TextStyle Text style for small text like the recover password description
textFieldStyle TextStyle Text style for [TextField] input text
buttonStyle TextStyle Text style for button text
beforeHeroFontSize double Defines the font size of the title in the login screen (before the hero transition)
afterHeroFontSize double Defines the font size of the title in the screen after the login screen (after the hero transition)
pageColorLight Color The optional light background color of login screen; if provided, used for light gradient instead of primaryColor
pageColorDark Color The optional dark background color of login screen; if provided, used for dark gradient instead of primaryColor

Examples

You can view the complete example in the example project which resulted in the gif above

Basic example

import 'package:flutter/material.dart';
import 'package:flutter_login/flutter_login.dart';
import 'dashboard_screen.dart';

const users = const {
  '[email protected]': '12345',
  '[email protected]': 'hunter',
};

class LoginScreen extends StatelessWidget {
  Duration get loginTime => Duration(milliseconds: 2250);

  Future<String> _authUser(LoginData data) {
    print('Name: ${data.name}, Password: ${data.password}');
    return Future.delayed(loginTime).then((_) {
      if (!users.containsKey(data.name)) {
        return 'Username not exists';
      }
      if (users[data.name] != data.password) {
        return 'Password does not match';
      }
      return null;
    });
  }

  Future<String> _recoverPassword(String name) {
    print('Name: $name');
    return Future.delayed(loginTime).then((_) {
      if (!users.containsKey(name)) {
        return 'Username not exists';
      }
      return null;
    });
  }

  @override
  Widget build(BuildContext context) {
    return FlutterLogin(
      title: 'ECORP',
      logo: 'assets/images/ecorp-lightblue.png',
      onLogin: _authUser,
      onSignup: _authUser,
      onSubmitAnimationCompleted: () {
        Navigator.of(context).pushReplacement(MaterialPageRoute(
          builder: (context) => DashboardScreen(),
        ));
      },
      onRecoverPassword: _recoverPassword,
    );
  }
}

Basic example with sign in providers

import 'package:flutter/material.dart';
import 'package:flutter_login/flutter_login.dart';
import 'dashboard_screen.dart';

const users = const {
  '[email protected]': '12345',
  '[email protected]': 'hunter',
};

class LoginScreen extends StatelessWidget {
  Duration get loginTime => Duration(milliseconds: 2250);

  Future<String> _authUser(LoginData data) {
    print('Name: ${data.name}, Password: ${data.password}');
    return Future.delayed(loginTime).then((_) {
      if (!users.containsKey(data.name)) {
        return 'Username not exists';
      }
      if (users[data.name] != data.password) {
        return 'Password does not match';
      }
      return null;
    });
  }

  Future<String> _recoverPassword(String name) {
    print('Name: $name');
    return Future.delayed(loginTime).then((_) {
      if (!users.containsKey(name)) {
        return 'Username not exists';
      }
      return null;
    });
  }

  @override
  Widget build(BuildContext context) {
    return FlutterLogin(
      title: 'ECORP',
      logo: 'assets/images/ecorp-lightblue.png',
      onLogin: _authUser,
      onSignup: _authUser,
      
        loginProviders: <LoginProvider>[
          LoginProvider(
            icon: FontAwesomeIcons.google,
            callback: () async {
              print('start google sign in');
              await Future.delayed(loginTime);
              print('stop google sign in');              
              return null;
            },
          ),
          LoginProvider(
            icon: FontAwesomeIcons.facebookF,
            callback: () async {            
              print('start facebook sign in');
              await Future.delayed(loginTime);
              print('stop facebook sign in');              
              return null;
            },
          ),
          LoginProvider(
            icon: FontAwesomeIcons.linkedinIn,
            callback: () async {         
              print('start linkdin sign in');
              await Future.delayed(loginTime);         
              print('stop linkdin sign in');              
              return null;
            },
          ),
          LoginProvider(
            icon: FontAwesomeIcons.githubAlt,
            callback: () async {
              print('start github sign in');
              await Future.delayed(loginTime);
              print('stop github sign in');              
              return null;
            },
          ),
        ],
      onSubmitAnimationCompleted: () {
        Navigator.of(context).pushReplacement(MaterialPageRoute(
          builder: (context) => DashboardScreen(),
        ));
      },
      onRecoverPassword: _recoverPassword,
    );
  }
}

Theming via ThemeData

Login theme can be customized indectly by using ThemeData like this

// main.dart
import 'package:flutter/material.dart';
import 'login_screen.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Login Demo',
      theme: ThemeData(
        primarySwatch: Colors.deepPurple,
        accentColor: Colors.orange,
        cursorColor: Colors.orange,
        textTheme: TextTheme(
          headline3: TextStyle(
            fontFamily: 'OpenSans',
            fontSize: 45.0,
            color: Colors.orange,
          ),
          button: TextStyle(
            fontFamily: 'OpenSans',
          ),
          subtitle1: TextStyle(fontFamily: 'NotoSans'),
          bodyText2: TextStyle(fontFamily: 'NotoSans'),
        ),
      ),
      home: LoginScreen(),
    );
  }
}

// login_screen.dart
import 'package:flutter/material.dart';
import 'package:flutter_login/flutter_login.dart';
import 'dashboard_screen.dart';

class LoginScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return FlutterLogin(
      title: 'ECORP',
      logo: 'assets/images/ecorp.png',
      onLogin: (_) => Future(null),
      onSignup: (_) => Future(null),
      onSubmitAnimationCompleted: () {
        Navigator.of(context).pushReplacement(MaterialPageRoute(
          builder: (context) => DashboardScreen(),
        ));
      },
      onRecoverPassword: (_) => Future(null),
    );
  }
}

Custom labels

import 'package:flutter/material.dart';
import 'package:flutter_login/flutter_login.dart';
import 'dashboard_screen.dart';

class LoginScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return FlutterLogin(
      title: 'ECORP',
      logo: 'assets/images/ecorp.png',
      onLogin: (_) => Future(null),
      onSignup: (_) => Future(null),
      onSubmitAnimationCompleted: () {
        Navigator.of(context).pushReplacement(MaterialPageRoute(
          builder: (context) => DashboardScreen(),
        ));
      },
      onRecoverPassword: (_) => Future(null),
      messages: LoginMessages(
        usernameHint: 'Username',
        passwordHint: 'Pass',
        confirmPasswordHint: 'Confirm',
        loginButton: 'LOG IN',
        signupButton: 'REGISTER',
        forgotPasswordButton: 'Forgot huh?',
        recoverPasswordButton: 'HELP ME',
        goBackButton: 'GO BACK',
        confirmPasswordError: 'Not match!',
        recoverPasswordDescription:
            'Lorem Ipsum is simply dummy text of the printing and typesetting industry',
        recoverPasswordSuccess: 'Password rescued successfully',
      ),
    );
  }
}
Login/Signup Password Recovery
Login/Signup Password Recovery

Theme customization

import 'package:flutter/material.dart';
import 'package:flutter_login/flutter_login.dart';
import 'dashboard_screen.dart';

class LoginScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final inputBorder = BorderRadius.vertical(
      bottom: Radius.circular(10.0),
      top: Radius.circular(20.0),
    );

    return FlutterLogin(
      title: 'ECORP',
      logo: 'assets/images/ecorp-lightgreen.png',
      onLogin: (_) => Future(null),
      onSignup: (_) => Future(null),
      onSubmitAnimationCompleted: () {
        Navigator.of(context).pushReplacement(MaterialPageRoute(
          builder: (context) => DashboardScreen(),
        ));
      },
      onRecoverPassword: (_) => Future(null),
      theme: LoginTheme(
        primaryColor: Colors.teal,
        accentColor: Colors.yellow,
        errorColor: Colors.deepOrange,
        titleStyle: TextStyle(
          color: Colors.greenAccent,
          fontFamily: 'Quicksand',
          letterSpacing: 4,
        ),
        bodyStyle: TextStyle(
          fontStyle: FontStyle.italic,
          decoration: TextDecoration.underline,
        ),
        textFieldStyle: TextStyle(
          color: Colors.orange,
          shadows: [Shadow(color: Colors.yellow, blurRadius: 2)],
        ),
        buttonStyle: TextStyle(
          fontWeight: FontWeight.w800,
          color: Colors.yellow,
        ),
        cardTheme: CardTheme(
          color: Colors.yellow.shade100,
          elevation: 5,
          margin: EdgeInsets.only(top: 15),
          shape: ContinuousRectangleBorder(
              borderRadius: BorderRadius.circular(100.0)),
        ),
        inputTheme: InputDecorationTheme(
          filled: true,
          fillColor: Colors.purple.withOpacity(.1),
          contentPadding: EdgeInsets.zero,
          errorStyle: TextStyle(
            backgroundColor: Colors.orange,
            color: Colors.white,
          ),
          labelStyle: TextStyle(fontSize: 12),
          enabledBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: Colors.blue.shade700, width: 4),
            borderRadius: inputBorder,
          ),
          focusedBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: Colors.blue.shade400, width: 5),
            borderRadius: inputBorder,
          ),
          errorBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: Colors.red.shade700, width: 7),
            borderRadius: inputBorder,
          ),
          focusedErrorBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: Colors.red.shade400, width: 8),
            borderRadius: inputBorder,
          ),
          disabledBorder: UnderlineInputBorder(
            borderSide: BorderSide(color: Colors.grey, width: 5),
            borderRadius: inputBorder,
          ),
        ),
        buttonTheme: LoginButtonTheme(
          splashColor: Colors.purple,
          backgroundColor: Colors.pinkAccent,
          highlightColor: Colors.lightGreen,
          elevation: 9.0,
          highlightElevation: 6.0,
          shape: BeveledRectangleBorder(
            borderRadius: BorderRadius.circular(10),
          ),
          // shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),
          // shape: CircleBorder(side: BorderSide(color: Colors.green)),
          // shape: ContinuousRectangleBorder(borderRadius: BorderRadius.circular(55.0)),
        ),
      ),
    );
  }
}

Inspiration

License

  • MIT License
Issues
  • Adding new field on sign up

    Adding new field on sign up

    how can i add new field like first name and last name during sign up ? any code sample

    enhancement 
    opened by srkraut 29
  • signup screen displayed between sign up card and app screen

    signup screen displayed between sign up card and app screen

    Start Sign Up
    First card Second card Push SUBMIT You will see the green success message ---than you will see second sign up card on the side--- than app

    bug 
    opened by meridorkobi 17
  • add confirm signup card

    add confirm signup card

    This change adds a new card to confirm signup (confirm account) by entering a confirmation code. It also adds the ability to "resend code" when needed. Two new callbacks to client app are included. All strings and messages are configurable.

    This change also includes support for jumping between two non-adjacent cards with animation. For example, in order to show the confirm signup card, we have to jump from card index 0 to card index 2, while still maintaining a smooth animation with the illusion that the cards are immediately adjacent.

    There are two "todo" left in confirm_signup_card.dart, because this change needs to be integrated with PR #13 in order to pass back the necessary login data using the shared auth provider.

    Another enhancement needed is the beautiful "change route animation" when switching from the confirm signup card to the dashboard.

    opened by doc-rj-celltrak 16
  • there are no textfield controller for textfield if i want textfield to alter or make auth with firebase.

    there are no textfield controller for textfield if i want textfield to alter or make auth with firebase.

    there are no textfield controller for textfield if i want textfield to alter or make auth with firebase.

    bug 
    opened by ZubairAAC 15
  • Need to trigger the login buttun twice - Firebase Auth

    Need to trigger the login buttun twice - Firebase Auth

    I need to trigger the button to login twice in order to go to my next screen. First an animation is triggered and my logo disapear. Then after the second hit, the onSubmitAnimationCompleted is called and I am going to my Routing behavior.

    Here are some screenshots : The first one if before the first click, and the second one just after it. I need to click again on the button to log-in.

    Screenshot_20200128-133949 Screenshot_20200128-134004

    -Expected behavior : Only one click needed to go the the onSubmitAnimationCompleted.

    Information (please complete the following information):

    • Device: OnePlus 7 pro
    • Platform: Android
    • Flutter version: 1.13.5
    • Package version: 1.0.13

    Here is the sourceCode of my LoginPage :

    class LoginScreen extends StatefulWidget {
      @override
      _LoginScreenState createState() => _LoginScreenState();
    }
    
    class _LoginScreenState extends State<LoginScreen> {
      @override
      void initState() {
        super.initState();
        _handleStartScreen();
      }
    
      // Si le user est deja logué, on redirige vers la page de dashboard
      Future<void> _handleStartScreen() async {
        final authentService = Provider.of<AuthentService>(context, listen: false);
        if (await authentService.isLoggedIn()) {
          Navigator.pushReplacementNamed(context, Router.dashboardRoute);
        }
      }
    
      @override
      Widget build(BuildContext context) {
        final authentService = Provider.of<AuthentService>(context);
        final compteUtilisateurService = Provider.of<CompteUtilisateurService>(context);
    
        return FlutterLogin(
          title: 'Nounou gestion',
          logo: 'assets/images/logo-sans-texte.png',
          onLogin: authentService.signIn,
          onSignup: authentService.signUp,
          onRecoverPassword: authentService.recoverPassword,
          showDebugButtons: false,
          onSubmitAnimationCompleted: () async {
            CompteUtilisateur infos = await compteUtilisateurService.getCompteUtilisateur(authentService.getIdUtilisateur());
            // Pas encore renseigné les infos personelles, on le redirige donc le bon écran.
            if (infos.id.isEmpty) {
              Navigator.pushReplacementNamed(context, Router.infosPersosRoute, arguments: CompteUtilisateur());
            } else {
              Navigator.pushReplacementNamed(context, Router.dashboardRoute);
            }
          },
          messages: LoginMessages(
            usernameHint: 'Mail utilisateur',
            passwordHint: 'Mot de passe',
            confirmPasswordHint: 'Confirmation mot de passe',
            loginButton: 'SE CONNECTER',
            signupButton: 'S\'INSCRIRE',
            forgotPasswordButton: 'Mot de passe oublié?',
            recoverPasswordButton: 'Aidez-moi',
            goBackButton: 'Retour',
            confirmPasswordError: 'Les deux mots de passe ne sont pas identiques!',
            recoverPasswordDescription: 'Un lien pour récupérer votre mot de passe va vous être envoyé par email.',
            recoverPasswordSuccess: 'Email de récupération du mot de passe envoyé.',
          ),
        );
      }
    }
    

    Is it because i don't have any Hero in my other screens after loggedIn ?

    Thank you.

    bug await user response 
    opened by JulienT-FL 15
  • :fire: Now, input decoration colors depends on primary color.

    :fire: Now, input decoration colors depends on primary color.

    This fix the next bug: https://github.com/NearHuscarl/flutter_login/issues/200

    It is also notewhorthy to say the prefix and sufix icons depends on the ThemeData.colorScheme.primary color, which can be differente to the ThemeData.primaryColor; we should make both to be the same or to make one of them by default.

    image

    @juliansteenbakker @NearHuscarl

    opened by SalahAdDin 13
  • Additonal signup fields

    Additonal signup fields

    Implements #54

    Added new generic fields that can be shown to the user on signup. The Form is shown in an additional card.

    The fields are provided like this:

          additionalSignupFields: [
            UserFormField(
                keyName: 'Username', icon: Icon(FontAwesomeIcons.userAlt)),
            UserFormField(keyName: 'Name', defaultValue: 'Steve'),
            UserFormField(keyName: 'Surname'),
            UserFormField(
              keyName: 'phone_number',
              displayName: 'Phone Number',
              userType: LoginUserType.phone,
              fieldValidator: (value) {
                var phoneRegExp = RegExp(
                    '^(\\+\\d{1,2}\\s)?\\(?\\d{3}\\)?[\\s.-]?\\d{3}[\\s.-]?\\d{4}\$');
                if (value != null &&
                    value.length < 7 &&
                    !phoneRegExp.hasMatch(value)) {
                  return "This isn't a valid phone number";
                }
                return null;
              },
            ),
          ],
    

    The result is: flutter_01

    A callback is then called to collect the filled in form as a Map<String,String>. The form can also be conditionally called after logging in with a provider, a boolean callback added to the LoginProvider class must be passed to control this.

    There are still some issues with this, for example the forgot password card is shown during the animation, and also further documentation is probably needed.

    opened by malta895 12
  • Clicking into user/password fields triggers Error: LateInitializationError: Local 'command' has not been initialized.

    Clicking into user/password fields triggers Error: LateInitializationError: Local 'command' has not been initialized.

    Describe the bug Error: LateInitializationError: Local 'command' has not been initialized. errors are triggered by text input field events and logged in the background.

    To Reproduce The issue can be reproduced easily when running the example project as a webapp, i.e., via flutter run -d chrome

    Expected behavior The widget still appears to "work", but the logged error messages are concerning.

    Information (please complete the following information): flutter doctor Doctor summary (to see all details, run flutter doctor -v): [✓] Flutter (Channel stable, 2.2.2, on Linux, locale en_US.UTF-8) [✓] Android toolchain - develop for Android devices (Android SDK version 30.0.2) [✓] Chrome - develop for the web [✓] Android Studio (version 4.2) [✓] IntelliJ IDEA Ultimate Edition (version 2021.1) [✓] VS Code (version 1.56.2) [✓] Connected device (1 available)

    Additional context

    • https://dart.dev/guides/language/language-tour#late-variables
    bug 
    opened by oysterpack 10
  • Migrate to sound null safety

    Migrate to sound null safety

    Description:

    • Migrate to sound null safety
    • Bump up package version
    help wanted 
    opened by lcsvcn 9
  • 'RenderBox was not laid out' was thrown

    'RenderBox was not laid out' was thrown

    Describe the bug 'RenderBox was not laid out' was thrown.

    To Reproduce Steps to reproduce the behavior: The code I wrote was below (just to show login form)

      import 'package:flutter/material.dart';                                                                                                                    
      import 'package:flutter_gen/gen_l10n/app_localizations.dart';                                                                                              
      import 'package:flutter_login/flutter_login.dart';                                                                                                         
                                                                                                                                                                 
      class LoginScreen extends StatelessWidget {                                                                                                                
        @override                                                                                                                                                
        Widget build(BuildContext context) {                                                                                                                     
          return FlutterLogin(                                                                                                                                   
            onLogin: handleAuthUser,                                                                                                                             
            onRecoverPassword: handleRecoveryPassword,                                                                                                           
            onSignup: handleSignup,                                                                                                                              
          ); // FlutterLogin                                                                                                                                     
        }                                                                                                                                                        
                                                                                                                                                                 
    >>  Future<String> handleAuthUser(LoginData data) {}                                                                                                         
    >>  Future<String> handleRecoveryPassword(String data) {}                                                                                                    
    >>  Future<String> handleSignup(LoginData data) {}                                                                                                           
      }                                                                                                                                                          
    ~     
    

    And when I start the app, an error was thrown

    $ flutter run
    

    Screenshots I can see the error message below

    An Observatory debugger and profiler on sdk gphone x86 arm is available at: http://127.0.0.1:42033/TOE7m9uJmNk=/
    I/flutter (13350): ══╡ EXCEPTION CAUGHT BY SCHEDULER LIBRARY ╞═════════════════════════════════════════════════════════
    I/flutter (13350): The following assertion was thrown during a scheduler callback:
    I/flutter (13350): RenderBox was not laid out: RenderRepaintBoundary#bb0f7 NEEDS-LAYOUT NEEDS-PAINT
    I/flutter (13350): 'package:flutter/src/rendering/box.dart':
    I/flutter (13350): Failed assertion: line 1785 pos 12: 'hasSize'
    I/flutter (13350): 
    I/flutter (13350): Either the assertion indicates an error in the framework itself, or we should provide substantially
    I/flutter (13350): more information in this error message to help you determine and fix the underlying cause.
    I/flutter (13350): In either case, please report this assertion by filing a bug on GitHub:
    I/flutter (13350):   https://github.com/flutter/flutter/issues/new?template=BUG.md
    I/flutter (13350): 
    I/flutter (13350): When the exception was thrown, this was the stack:
    I/flutter (13350): #2      RenderBox.size (package:flutter/src/rendering/box.dart:1785:12)
    I/flutter (13350): #3      RenderBox.paintBounds (package:flutter/src/rendering/box.dart:2389:41)
    I/flutter (13350): #4      _TransformerPageViewState._onGetSize (package:transformer_page_view/transformer_page_view.dart:461:34)
    I/flutter (13350): #5      SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1117:15)
    I/flutter (13350): #6      SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1063:9)
    I/flutter (13350): #7      SchedulerBinding.scheduleWarmUpFrame.<anonymous closure> (package:flutter/src/scheduler/binding.dart:864:7)
    I/flutter (13350): (elided 13 frames from class _AssertionError, class _RawReceivePortImpl, class _Timer, dart:async, and dart:async-patch)
    I/flutter (13350): ════════════════════════════════════════════════════════════════════════════════════════════════════
    

    Information (please complete the following information):

    • Device: Nexus9 (emulator)
    • Platform android (API 30)
    • Flutter version: 1.22.4
    • Package version 1.0.14
    bug help wanted 
    opened by satoyan 9
  • [FEATURE] UserType change but didnt works

    [FEATURE] UserType change but didnt works

    i try use UserType.name but the error correction still "invalid email"

    how to fix this ?

    enhancement 
    opened by androidEl 0
  • [FEATURE] Add informations for signup password

    [FEATURE] Add informations for signup password

    I think it would be interesting to be able to add information on the different fields when registering for example for the password indicate the minimum length, if uppercase .... And the same for the additional fields.

    this can be similar to the displayed errors.

    and also to add constraints only during the registration, for example the size of the password ... which are not necessary during the login

    enhancement 
    opened by cedricDevWP 0
  • Unhandled Exception:  AnimationController methods should not be used after calling dispose.

    Unhandled Exception: AnimationController methods should not be used after calling dispose.

    When login with a valid account everything is ok. But logout then login with an invalid account, got this exception:

    E/flutter (30559): [ERROR:flutter/lib/ui/ui_dart_state.cc(209)] Unhandled Exception: 'package:flutter/src/animation/animation_controller.dart': Failed assertion: line 488 pos 7: '_ticker != null': AnimationController.reverse() called after AnimationController.dispose() package:flutter/…/animation/animation_controller.dart:1 E/flutter (30559): AnimationController methods should not be used after calling dispose. E/flutter (30559): #0 _AssertionError._doThrowNew (dart:core-patch/errors_patch.dart:46:39) E/flutter (30559): #1 _AssertionError._throwNew (dart:core-patch/errors_patch.dart:36:5) E/flutter (30559): #2 AnimationController.reverse package:flutter/…/animation/animation_controller.dart:488 E/flutter (30559): #3 _LoginCardState._submit package:flutter_login/…/cards/login_card.dart:193 E/flutter (30559): E/flutter (30559): W/System (30559): A resource failed to call release.

    To Reproduce Steps to reproduce the behavior:

    1. Login with a valid account.
    2. Logout
    3. Try to login with an invalid account
    4. See error

    Expected behavior A clear and concise description of what you expected to happen.

    Screenshots If applicable, add screenshots to help explain your problem.

    Information (please complete the following information):

    • Device: android emulator & android phone
    • Platform android
    • Flutter version:
    • Package version

    Additional context

    bug 
    opened by wo4haoren 1
  • [FEATURE] following important

    [FEATURE] following important

    Please:

    option to set user id and not email... HOW TO FIX THIS>> If I want to use dribbble instead of [email protected] how to do this???

    how to remove the RECOVER PASSWOROD button and sign up buttons??? please tell

    enhancement 
    opened by fisforfaheem 0
  • Change prefix and suffix icon color

    Change prefix and suffix icon color

    I use these attributes, but the icon does not change, prefixIconColor: Colors.yellow, suffixIconColor: Colors.yellow,

    bug 
    opened by Spiderbezno 1
  • children on 3.1.0 prevents touch

    children on 3.1.0 prevents touch

    When you add a children then you cannot touch eg password, only keyboard next is working This happens when the asset is big enough to overlap the password

    Steps to reproduce the behavior:

    1. just add a children: [ Image.asset('assets/images/test_opac.png') ],
    2. try to enter credentials. email is fine but you cannot select password on touch
    bug 
    opened by gmeles 0
  • Login/sign up form not changing according to login user type

    Login/sign up form not changing according to login user type

    Login/sign up form not changing according to login user type. The following code showing login/sign up page for "Email and password" not according to phone number.

    Code is as following:

    Widget build(BuildContext context) { return FlutterLogin( userType: LoginUserType.phone, title: 'test', logo: AssetImage('assets/images/r-logo.png'), onLogin: _authUser, onSignup: _signupUser, onSubmitAnimationCompleted: () { // Navigator.of(context).pushReplacement(MaterialPageRoute( // builder: (context) => DashboardScreen(), // )); Get.snackbar('Login', 'Login Successful'); }, initialAuthMode: AuthMode.signup, onRecoverPassword: _recoverPassword, ); }

    bug 
    opened by Murtoz-h 3
  • Added Custom Login & Recovery Fields

    Added Custom Login & Recovery Fields

    Custom Login Fields: Now user can add custom login fields. Default login fields will be replaced by custom login fields. User can access custom fields value like this:

    onLogin: (LoginData data) async {
        Map<String, String>? customLogin = data.customLoginData;
        debugPrint('$keyName: ${customLogin[keyName]');
        .....
    }
    

    Custom recover Fields: Now user can add custom recover fields. Default login fields will be replaced by custom recover fields. User can access custom fields value like this:

    onRecoverPasswordCustom: (RecoverData data) async {
        debugPrint('$keyName:: ${data.customRecoverData![keyname]}');
        .....
    }
    

    I think in next version of flutter_login we can replace onRecoverPasswordCustom.

    opened by mahbd 4
  • Wrong data type on additionalSignUpFields

    Wrong data type on additionalSignUpFields

    Describe the bug A clear and concise description of what the bug is.

    To Reproduce Steps to reproduce the behavior:

    1. Go to additionalSignUpFields Documentation and flutter_login.dart line 369

    Expected behavior The description on the docs should be List<UserFormField>

    Screenshots alt text

    bug 
    opened by WaterBlueNewWorld 0
Releases(3.1.0)
  • 3.1.0(Dec 13, 2021)

    Features:

    • Add children parameter to FlutterLogin which takes a list of widgets that can be added in the background of the Login view. For example: a custom banner or a custom logo.
    • Improved footer style

    Bugs fixed:

    • The signup confirmation page is now also shown when additionalSignupData is not provided or loginAfterSignUp is disabled.
    • Back button of confirmSignUp page now returns Login or AdditionalSignUpData page depending on whether additionalSignupData has been provided or not.
    Source code(tar.gz)
    Source code(zip)
  • 3.0.0(Nov 12, 2021)

    First stable release of 3.0.0. Please see the changelog entries of the beta versions for all changes. New features include:

    • Additional signup fields!
    • Confirmation card for password recovery.
    • Confirmation card for user registration.

    This release also fixes:

    • White space visible when animation is complete
    • Several other animation improvements
    Source code(tar.gz)
    Source code(zip)
  • 3.0.0-beta.2(Oct 6, 2021)

    Besides the existing loginProvider icons, you can now also add a LoginButton as provider widget. Please check out flutter_signin_button for supported buttons.

    BREAKING CHANGES:

    • Provider has been updated to 6.0.1.
    • Instead of hideSignUpButton, you can now set onSignup parameter to null (or just leave it out) in order to hide the signup button.

    Fixed several other small bugs like color not being applied correctly to all widgets.

    Source code(tar.gz)
    Source code(zip)
  • 3.0.0-beta.1(Aug 16, 2021)

    You can now add more signup-fields! Please keep in mind that this is a beta release and may still contain bugs.

    Other features:

    You can now use an ImageProvider instead of only an AssetImage. #216

    Source code(tar.gz)
    Source code(zip)
  • 2.2.1(Jul 26, 2021)

  • 2.2.0(Jul 16, 2021)

    Features

    • Added possibility to disable custom page transformer. #202
    • Added possibility to automatically navigate back to login page after successful recovery. #207

    Bug fixes

    • Fixed primary color not applying to input decoration. (@SalahAdDin in #201)
    • Fixed forgot password button not coloring. #203
    • Fixed black text when night mode is enabled and no other theme is provided. #206
    • Fixed routing issue in example app. #204
    Source code(tar.gz)
    Source code(zip)
  • v2.1.0(Jun 28, 2021)

    Features

    • Added possibility to change switch authentication button color. #195
    • Added possibility to change logo size. #193
    • Added labels to LoginProviders. #192
    • Added a bar with title/description above providers. Can be disabled using hideProvidersTitle. See #181

    Bug fixes

    • Fixed animation padding not filling screen. #194
    Source code(tar.gz)
    Source code(zip)
  • 2.0.0-1(Jun 7, 2021)

    Stable release of null-safety

    Changed

    • emailValidator is now userValidator

    Features

    • Add bottom padding to LoginTheme

    Also fixed numerous other bugs.

    Source code(tar.gz)
    Source code(zip)
  • 2.0.0-nullsafety.0(Mar 31, 2021)

  • 1.1.0(Mar 30, 2021)

    Features (30/03/2021)

    • Possibility to hide the sign-up and forgot password button #115
    • Possibility to provide flushbar title #117
    • Support for auto-fill hints #125
    • Possibility to navigate back to login after sign-up #126
    • Support for external login providers #127
    • Footer for copyright notice #129
    • Add custom padding to sign-up and login provider buttons #135
    • Possibility to only show logo without title

    Bug fixes

    • Add safe area to header
    • Scaffold is now transparent so background images are now supported
    • Fix logo size
    • Disable auto-correct for text field
    Source code(tar.gz)
    Source code(zip)
  • 1.0.15(Mar 18, 2021)

    Bug fixes (16/03/2021)

    • Fixed animationController methods should not be used after calling dispose #114
    • Upgrade to AndroidX #111
    • Upgrade Android example to embedding V2 #110
    • Fixed initialRoute function #110
    • Added pedantic for code analysis #110
    • Migrated discontinued flushbar to another_flushbar #110
    • Updated all deprecated widgets to current widgets #110
    • Fixed widget_test #110
    Source code(tar.gz)
    Source code(zip)
Owner
Near Huscarl
Near Huscarl
Authentication API client with Flutter (Login, Register, Google Login, Facebook Login, Apple Login)

Flutter Auth App (Login, Register, Google Login, Facebook Login, Apple Login) To use this client, get the server up and running. Try it out now! App S

Denzel Giraldo 18 Jan 8, 2022
Simple Flappy Bird Game with the most functionalities developed in Flutter

flappy_bird Flutter Game App for Graphics Course Getting Started This project is a starting point for a Flutter application. A few resources to get yo

Ziyad Mansy 8 Nov 10, 2021
A two screen video call app built with flutter with the help of jitsi plugin

flutter_video_call A new Flutter application. Getting Started This project is a starting point for a Flutter application.

Success Charles 26 Nov 22, 2021
Flutter Floating Action Button with Speed Dial

UnicornDialer Easily create your own floating action button list Installing Add UnicornDialer to your pubspec.yaml unicorndial: "^1.1.5" Options Unic

Tiago Martins 308 Jan 2, 2022
A Flutter widget that paints an image and moves it at a slower speed than the main scrolling content.

A Flutter widget that paints an image and moves it at a slower speed than the main scrolling content. Installation Add dependency to your pubspec.yaml

Anatoly Pulyaevskiy 258 Jan 14, 2022
Speed Code 2 - 漂亮的饮料食谱 App

?? 饮料食谱 App - 登录 UI - Speed Code ?? 项目介绍 ?? 这是我的第 2 个 Speed Code 视频,通过此项目视频你可以学习到如下 Widget 的基础或进阶用法,更重要的你可以学习到如何将这些 Widget 灵活的组合最终实现上面 ?? 的效果。如果觉得有用可以

Zero 45 Nov 15, 2021
Login Animation Ruchika GuptaLogin Animation [953⭐] - Smooth animation from login to home by Ruchika Gupta.

Flutter Login Home Animation A new open-source Flutter project that enables the developer to quickly get started with the Flutter animation and applic

GeekyAnts 1.1k Jan 17, 2022
Flutter Login Page Bloc Pattern App Flutter Login Page Bloc Pattern App

gdgbloc A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if this

Pawan Kumar 95 Oct 12, 2021
Highly Subjective Roadmap to Flutter Development

Flutter Roadmap Dev Environment https://learngitbranching.js.org Language https://dart.dev/guides/language/language-tour https://dart.dev/guides/langu

Oleksandr Leuschenko 3k Jan 19, 2022
Learn to Code While Building Apps - The Complete Flutter Development Bootcamp

Learn to Code While Building Apps - The Complete Flutter Development Bootcamp

London App Brewery 8.4k Jan 14, 2022
This is mobile application fortune telling using Flutter for development.

Flutter Tarot Card Description: This is mobile application fortune telling using Flutter for development. How I can run it? ?? Clone this repository ?

Dao Hong Vinh 13 Jan 6, 2022
This is the semester 6 Mobile App Development Course project. So maybe the final project may not make sense ;) but it is a good place to start learning Flutter.

?? Overview MAD-Sem6 is a Mobile Development Course Project that contains Basic ➡️ Medium implementation of different widgets. As a whole it doesn't m

Muhammad Tayyab Asghar 3 Aug 9, 2021
COVID-19 application made with Flutter, following Test Driven Development (TDD) and Clean Architecture along with Internationalization with JSON.

Covid App COVID-19 application made with Flutter, following Test Driven Development (TDD) and Clean Architecture along with Internationalization with

Sandip Pramanik 3 May 24, 2021
Implementing Firebase Authentication with Riverpod following Flutter Domain Driven Development pattern

firebase_auth_flutter_ddd Firebase authentication example with Hooks Riverpod and Freezed following Flutter DDD architecture Getting Started This proj

Python Hub 19 Dec 29, 2021
Addons to supabase dart (and Flutter), to make development easier.

supabase_addons Make great apps with a great backend! Supabase is an open source Firebase alternative. It has support for auth, database and storage u

Bruno D'Luka 16 Sep 30, 2021
DropdownButton, ToggleButton & CheckboxListTile implementation in Flutter as a Mobile App Development exercise.

Sort & Filter UI A new Flutter project. Getting Started This project is a starting point for a Flutter application. ⏮ Preview A few resources to get y

Ehmad Saeed⚡ 8 Sep 29, 2021
Trying out Flutter for desktop Web app development as an alternative to SPA frameworks (such as React and Angular) by recreating one of the pages of an existing CV Management web app

HTML Renderer Demo CanvasKit Renderer Demo Reddit discussion This repo contains a PoC of using Flutter as a traditional SPA framework for creating a d

Maxim Saplin 13 Dec 26, 2021
This package provides some widgets you can use to create a smooshy UI.

Dough Library Squishy widgets for Flutter. Quick Links Dough Demos Here are a few samples of the different widgets provided by this repo. You can find

Josiah Saunders 403 Jan 11, 2022
A package provides an easy way to add shimmer effect in Flutter project

Shimmer A package provides an easy way to add shimmer effect in Flutter project How to use import 'package:shimmer/shimmer.dart'; SizedBox( width:

HungHD 1.4k Jan 11, 2022
📸 Easy to use yet very customizable zoomable image widget for Flutter, Photo View provides a gesture sensitive zoomable widget. Photo View is largely used to show interacive images and other stuff such as SVG.

Flutter Photo View A simple zoomable image/content widget for Flutter. PhotoView enables images to become able to zoom and pan with user gestures such

Fire Slime Games 1.5k Jan 13, 2022
A Flutter plugin to easily handle realtime location in iOS and Android. Provides settings for optimizing performance or battery.

Flutter Location Plugin This plugin for Flutter handles getting location on Android and iOS. It also provides callbacks when location is changed. Gett

Guillaume Bernos 850 Jan 14, 2022
Permission plugin for Flutter. This plugin provides a cross-platform (iOS, Android) API to request and check permissions.

On most operating systems, permissions aren't just granted to apps at install time. Rather, developers have to ask the user for permissions while the

Baseflow 1.4k Jan 15, 2022
Converts SVG icons to OTF font and generates Flutter-compatible class. Provides an API and a CLI tool.

Fontify The Fontify package provides an easy way to convert SVG icons to OpenType font and generate Flutter-compatible class that contains identifiers

Igor Kharakhordin 79 Jan 13, 2022
A flutter plugin which provides Crop Widget for cropping images.

A flutter plugin which provides Crop Widget for cropping images. crop_your_image provides only minimum UI for deciding cropping area inside images. Other UI parts, such as "Crop" button or "Change Aspect Ratio" button, need to be prepared by each app developers.

Chooyan 61 Jan 11, 2022
A Flutter package that provides an Emoji picker widget with 1500+ emojis in 8 categories.

emoji_picker_flutter Yet another Emoji Picker for Flutter ?? Note: This package is based on emoji_picker which has been deprecated and not maintained

Stefan Humm 48 Jan 15, 2022
Provides API to generate Dart source code

DartWriter DartWriter provides API to generate Dart source code. It can make your job easier while developing flutter/dart tools. You can also generat

Ahmet ÇELİK 7 Jul 3, 2021
Movie Lib is a mobile application where you can find the movies of your interest. This app provides a collection of movies of different languages according to your interest.

Movie Lib Movie Lib is a mobile application where you can find the movies of your interest. This app provides a collection of movies of different lang

Abhijith Kp 6 Sep 28, 2021
The FlexGrid control provides a powerful and quickly way to display data in a tabular format. It is including that frozened column/row,loading more, high performance and better experience in TabBarView/PageView.

flex_grid Language: English| 中文简体 The FlexGrid control provides a powerful and quickly way to display data in a tabular format. It is including that f

FlutterCandies 32 Jan 6, 2022