{"id":31267914,"url":"https://github.com/NearHuscarl/flutter_login","last_synced_at":"2025-09-23T17:02:56.432Z","repository":{"id":37706061,"uuid":"208842838","full_name":"NearHuscarl/flutter_login","owner":"NearHuscarl","description":"Provides login screen with login/signup functionalities to help speed up development","archived":false,"fork":false,"pushed_at":"2025-09-17T10:54:56.000Z","size":17398,"stargazers_count":1581,"open_issues_count":101,"forks_count":824,"subscribers_count":26,"default_branch":"master","last_synced_at":"2025-09-17T12:37:22.455Z","etag":null,"topics":["android","animation","dart","flutter","flutter-package","flutter-widget","login","material"],"latest_commit_sha":null,"homepage":"","language":"Dart","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/NearHuscarl.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2019-09-16T16:08:13.000Z","updated_at":"2025-09-17T10:55:00.000Z","dependencies_parsed_at":"2023-02-11T21:15:47.602Z","dependency_job_id":"cba7ecd2-4310-423b-bc00-777bb831a53c","html_url":"https://github.com/NearHuscarl/flutter_login","commit_stats":{"total_commits":441,"total_committers":37,"mean_commits":11.91891891891892,"dds":0.6984126984126984,"last_synced_commit":"460bd39ab5d959bd7620ca427c25df67f133551f"},"previous_names":[],"tags_count":23,"template":false,"template_full_name":null,"purl":"pkg:github/NearHuscarl/flutter_login","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NearHuscarl%2Fflutter_login","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NearHuscarl%2Fflutter_login/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NearHuscarl%2Fflutter_login/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NearHuscarl%2Fflutter_login/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/NearHuscarl","download_url":"https://codeload.github.com/NearHuscarl/flutter_login/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/NearHuscarl%2Fflutter_login/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":276613293,"owners_count":25673399,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-23T02:00:09.130Z","response_time":73,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","animation","dart","flutter","flutter-package","flutter-widget","login","material"],"created_at":"2025-09-23T17:01:43.022Z","updated_at":"2025-09-23T17:02:56.426Z","avatar_url":"https://github.com/NearHuscarl.png","language":"Dart","funding_links":[],"categories":["组件","Dart","UI [🔝](#readme)"],"sub_categories":["UI"],"readme":"# Flutter Login\n[![pub package](https://img.shields.io/pub/v/flutter_login?include_prereleases)](https://pub.dartlang.org/packages/flutter_login)\n[![Join the chat](https://img.shields.io/discord/817442412313051220)](https://discord.gg/kP7jXHeNtS)\n[![Workflow](https://github.com/NearHuscarl/flutter_login/actions/workflows/test.yml/badge.svg?branch=master)](https://github.com/NearHuscarl/flutter_login/actions)\n\n`FlutterLogin` is a ready-made login/signup widget with many animation effects to\ndemonstrate the capabilities of Flutter\n\n\u003cp align=\"center\"\u003e\n \u003ca href='https://i.imgur.com/z3FJSe7.mp4'\u003e\n \u003cimg src='https://github.com/NearHuscarl/flutter_login/raw/master/demo/demo.gif' width=320\u003e\n \u003c/a\u003e\n\u003c/p\u003e\n\n## Installation\n\nFollow the install instructions [here](https://pub.dev/packages/flutter_login#-installing-tab-)\n\n## Reference\n\n| Property | Type | Description |\n|---------------------------------------|-----------------------------------------|--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| onSignup | `AuthCallback` | \u003csub\u003eCalled when the user hit the submit button when in sign up mode. It receives a `SignupData` object, with name, password and, if `additionalSignUpFields` is not null, the additional fields filled in by the user in a `Map\u003cString,String\u003e`\u003c/sub\u003e |\n| onConfirmSignup | `ConfirmSignupCallback` | \u003csub\u003eCalled when the user hits the submit button when confirming signup. If not specified, signup will not be confirmed by user.\u003c/sub\u003e |\n| confirmSignupRequired | `ConfirmSignupRequiredCallback` | \u003csub\u003eAdditional option to decide in runtime if confirmation is required. If not specified, signup will be confirmed by user if onConfirmSignup is specified.\u003c/sub\u003e |\n| confirmSignupKeyboardType | `TextInputType` | \u003csub\u003eThe keyboard type of the confirm signup field\u003c/sub\u003e |\n| onResendCode | `AuthCallback` | \u003csub\u003eCalled when the user hits the resend code button when confirming signup. Only required when onConfirmSignup is provided.\u003c/sub\u003e |\n| onLogin | `AuthCallback` | \u003csub\u003eCalled when the user hit the submit button when in login mode\u003c/sub\u003e |\n| onRecoverPassword | `RecoverCallback` | \u003csub\u003eCalled when the user hit the submit button when in recover password mode\u003c/sub\u003e |\n| onConfirmRecover | `ConfirmRecoverCallback` | \u003csub\u003eCalled when the user submits confirmation code and sets password in recover password mode. If not specified, a confirmation code will not be used to recover password.\u003c/sub\u003e |\n| title | `String` | \u003csub\u003eThe large text above the login [Card], usually the app or company name. Leave the string empty or null if you want no title.\u003c/sub\u003e |\n| logo | `ImageProvider or String` | \u003csub\u003eThe image provider or asset path string for the logo image to be displayed\u003c/sub\u003e |\n| messages | [`LoginMessages`](#LoginMessages) | \u003csub\u003eDescribes all of the labels, text hints, button texts and other auth descriptions\u003c/sub\u003e |\n| theme | [`LoginTheme`](#LoginTheme) | \u003csub\u003eFlutterLogin'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\u003c/sub\u003e |\n| userType | [`LoginUserType`](#LoginUserType) | \u003csub\u003eFlutterLogin's user type. If not specified, it will use the default user type as email\u003c/sub\u003e |\n| userValidator | \u003csub\u003e`FormFieldValidator\u003cString\u003e`\u003c/sub\u003e | \u003csub\u003eUser field validating logic, add your custom validation here. The default is email validation logic. Expects to return an error message [String] to be display if validation fails or [null] if validation succeeds\u003c/sub\u003e |\n| validateUserImmediately | \u003csub\u003e`bool`\u003c/sub\u003e | \u003csub\u003eShould email be validated after losing focus [true] or after form submissions [false]. Default: [false]\u003c/sub\u003e |\n| passwordValidator | \u003csub\u003e`FormFieldValidator\u003cString\u003e`\u003c/sub\u003e | \u003csub\u003eSame as `userValidator` but for password\u003c/sub\u003e |\n| \u003csub\u003eonSubmitAnimationCompleted\u003c/sub\u003e | `Function` | \u003csub\u003eCalled after the submit animation's completed. Put your route transition logic here\u003c/sub\u003e |\n| logoTag | `String` | \u003csub\u003e`Hero` tag for logo image. If not specified, it will simply fade out when changing route\u003c/sub\u003e |\n| titleTag | `String` | \u003csub\u003e`Hero` tag for title text. Need to specify `LoginTheme.beforeHeroFontSize` and `LoginTheme.afterHeroFontSize` if you want different font size before and after hero animation\u003c/sub\u003e |\n| showDebugButtons | `bool` | \u003csub\u003eDisplay the debug buttons to quickly forward/reverse login animations. In release mode, this will be overridden to `false` regardless of the value passed in\u003c/sub\u003e |\n| hideForgotPasswordButton | `bool` | \u003csub\u003eHides the Forgot Password button if set to true\u003c/sub\u003e |\n| hideProvidersTitle | `bool` | \u003csub\u003eHides the title above login providers if set to true. In case the providers List is empty this is uneffective, as the title is hidden anyways. The default is `false`\u003c/sub\u003e |\n| disableCustomPageTransformer | `bool` | \u003csub\u003eDisables the custom transition which causes RenderBox was not laid out error. See [#97](https://github.com/NearHuscarl/flutter_login/issues/97) for more info.\u003c/sub\u003e |\n| additionalSignUpFields | `Map\u003cString, UserFormField\u003e` | \u003csub\u003e Used to specify the additional form fields; the form is shown right after signin up. You can provide at most 6 additional fields. \u003c/sub\u003e |\n| onSwitchToAdditionalFields | `AdditionalFieldsCallback` | \u003csub\u003eCalled when the user switches to additional fields.\u003c/sub\u003e |\n| navigateBackAfterRecovery | `bool` | \u003csub\u003eNavigate back to the login page after successful recovery.\u003c/sub\u003e |\n| savedEmail | `String` | \u003csub\u003ePrefilled value for user field (ie. saved from previous session via other means, ie. via SharedPreferences)\u003c/sub\u003e |\n| savedPassword | `String` | \u003csub\u003ePrefilled value for password field (ie. saved from previous session via other means, ie. via SharedPreferences). Will set also confirmation password in Auth class\u003c/sub\u003e |\n| termsOfService | [`TermOfService`](#TermOfService) | \u003csub\u003eList of terms of service to be listed during registration. On onSignup callback LoginData contains a list of [`TermOfServiceResult`](#TermOfServiceResult) \u003c/sub\u003e |\n| children | [`Widget`] | \u003csub\u003eList of widgets that can be added to the stack of the login screen. Can be used to show custom banners or logos. \u003c/sub\u003e |\n| scrollable | `bool` | \u003csub\u003eWhen set to true, the login card becomes scrollable instead of resizing when needed. |\n| headerWidget | `Widget` | \u003csub\u003eA widget that can be placed on top of the loginCard.\u003c/sub\u003e |\n| autofocus | `bool` | \u003csub\u003eWhether or not to automatically focus on the first field.\u003c/sub\u003e |\n\n*NOTE:* It is recommended that the child widget of the `Hero` widget should be the\nsame in both places. For title's hero animation use the\n`LoginThemeHelper.loginTextStyle` in the next screen to get the style of the\nexact text widget in the login screen. `LoginThemeHelper` can be accessed by adding\nthis line\n\n```dart\nimport 'package:flutter_login/theme.dart';\n```\n\n### LoginMessages\n\n| Property | Type | Description |\n|---------------------------------|----------|------------------------------------------------------------------------------------------------------------------------------------------------|\n| userHint | `String` | Hint text of the user field [TextField] (Note: user field can be name, email or phone. For more info check: [`LoginUserType`](#LoginUserType)) |\n| passwordHint | `String` | Hint text of the password [TextField] |\n| confirmPasswordHint | `String` | Hint text of the confirm password [TextField] |\n| forgotPasswordButton | `String` | Forgot password button's label |\n| loginButton | `String` | Login button's label |\n| signupButton | `String` | Signup button's label |\n| recoverPasswordButton | `String` | Recover password button's label |\n| recoverPasswordIntro | `String` | Intro in password recovery form |\n| recoverPasswordDescription | `String` | Description in password recovery form, shown when the onConfirmRecover callback is not provided |\n| recoverCodePasswordDescription | `String` | Description in password recovery form, shown when the onConfirmRecover callback is provided |\n| 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 |\n| confirmPasswordError | `String` | The error message to show when the confirm password not match with the original password |\n| recoverPasswordSuccess | `String` | The success message to show after submitting recover password |\n| confirmSignupIntro | `String` | The intro text for the confirm signup card |\n| confirmationCodeHint | `String` | Hint text of the confirmation code [TextField] |\n| confirmationCodeValidationError | `String` | The error message to show if confirmation code is empty |\n| resendCodeButton | `String` | Resend code button's label |\n| resendCodeSuccess | `String` | The success message to show after resending a confirmation code |\n| confirmSignupButton | `String` | Confirm signup button's label |\n| confirmSignupSuccess | `String` | The success message to show after confirming signup |\n| confirmRecoverIntro | `String` | The intro text for the confirm recover password card |\n| recoveryCodeHint | `String` | Hint text of the recovery code [TextField] |\n| recoveryCodeValidationError | `String` | The error message to show if recovery code is empty |\n| setPasswordButton | `String` | Set password button's label for password recovery |\n| confirmRecoverSuccess | `String` | The success message to show after confirming recovered password |\n| flushbarTitleError | `String` | The Flushbar title on errors |\n| flushbarTitleSuccess | `String` | The Flushbar title on successes |\n| providersTitle | `String` | A string shown above the login Providers, defaults to `or login with` |\n\n### LoginTheme\n\n| Property | Type | Description |\n|--------------------------|------------------------|-------------------------------------------------------------------------------------------------------------------|\n| primaryColor | `Color` | The background color of major parts of the widget like the login screen and buttons |\n| accentColor | `Color` | The secondary color, used for title text color, loading icon, etc. Should be contrast with the [primaryColor] |\n| errorColor | `Color` | The color to use for [TextField] input validation errors |\n| cardTheme | `CardTheme` | The colors and styles used to render auth [Card] |\n| inputTheme | `InputDecorationTheme` | Defines the appearance of all [TextField]s |\n| buttonTheme | `LoginButtonTheme` | A theme for customizing the shape, elevation, and color of the submit button |\n| titleStyle | `TextStyle` | Text style for the big title |\n| bodyStyle | `TextStyle` | Text style for small text like the recover password description |\n| textFieldStyle | `TextStyle` | Text style for [TextField] input text |\n| buttonStyle | `TextStyle` | Text style for button text |\n| beforeHeroFontSize | `double` | Defines the font size of the title in the login screen (before the hero transition) |\n| afterHeroFontSize | `double` | Defines the font size of the title in the screen after the login screen (after the hero transition) |\n| pageColorLight | `Color` | The optional light background color of login screen; if provided, used for light gradient instead of primaryColor |\n| pageColorDark | `Color` | The optional dark background color of login screen; if provided, used for dark gradient instead of primaryColor |\n| footerBottomPadding | `double` | The footer bottom Padding; defaults to 0 if not provided. |\n| switchAuthTextColor | `Color` | The optional color for the switch authentication text, if nothing is specified [primaryColor] is used. |\n| logoWidth | `double` | Width of the logo where 1 is the full width of the login card. ; defaults to 0.75 if not provided. |\n| primaryColorAsInputLabel | `bool` | Set to true if you want to use the primary color for input labels. Defaults to false. |\n\n### LoginUserType\n| Enum | Description |\n|-----------|--------------------------------------------------------------------|\n| EMAIL | The User Field will be set to be email |\n| NAME | The User Field will be set to be username |\n| FIRSTNAME | The User Field will be set to be first name |\n| LASTNAME | The User Field will be set to be last name |\n| PHONE | The User Field will be set to be phone |\n| INTLPHONE | The User Field will be set to be phone with country code selection |\n| TEXT | The User Field will be set to be text |\n\n[LoginUserType] will change how the user field [TextField] behaves. Autofills and Keyboard Type will be adjusted automatically for the type of user that you pass.\n\n### UserFormField\n| Property | Type | Description |\n|----------------|------------------------------|---------------------------------------------------------------------------------------------------------------------------------------|\n| keyName | `String` | The identifier of the fields, it will be the key in the returned map. Please ensure this is unique, otherwise an Error will be thrown |\n| displayName | `String` | The name of the field displayed on the form. Defaults to `keyName` if not given |\n| defaultValue | `String` | The default value of the field, if given the field will be pre-filled in with this |\n| fieldValidator | `FormFieldValidator\u003cString\u003e` | A function to validate the field. It should return null on success, or a string with the explanation of the error |\n| icon | `Icon?` | The icon shown on the left of the field. Defaults to the user icon when not provided |\n| userType | `LoginUserType` | The LoginUserType of the form. The right keyboard and suggestions will be shown accordingly. Defaults to `LoginUserType.user` |\n| tooltip | `InlineSpan` | Additional description for that field |\n\n### LoginProvider\n| Property | Type | Description |\n|-----------------------------|--------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| button | `Widget` | Used for Buttons for [LoginProvider] - see example uses [SignInButton] package |\n| icon | `IconData` | Icon that is used for a button for [LoginProvider] |\n| label | `String` | The label shown under the provider |\n| callback | `ProviderAuthCallback` | A Function called when the provider button is pressed. It must return null on success, or a `String` describing the error on failure. |\n| providerNeedsSignUpCallback | `ProviderNeedsSignUpCallback?` | Optional. Requires that the `additionalSignUpFields` argument is passed to `FlutterLogin`. When given, this callback must return a `Future\u003cbool\u003e`. If it evaluates to `true` the card containing the additional signup fields is shown, right after the evaluation of `callback`. If not given the default behaviour is not to show the signup card. |\n\n*NOTE:* Both [button] and [icon] can be added to [LoginProvider], but [button] will take preference over [icon]\n\n### TermOfService\n\n\n| Property | Type | Description |\n|------------------------|----------|---------------------------------------------------------------------------------------------------------------|\n| id | `String` | Used only on Signup callback to identify a single Term Of service if it's optional. |\n| mandatory | `bool` | If set true and term is not check when form is validate on submit, the validation error message will be shown |\n| text | `String` | Name of Term to show. |\n| linkUrl | `String` | Web url link to additional term of services info. |\n| validationErrorMessage | `String` | Validation error message to show. |\n| initialValue | `bool` | Specify if checkbox is initialized checked |\n\n#### TermOfServiceResult\n\n| Property | Type | Description |\n|----------|-----------------------------------|-------------------------------------------------------------------------------|\n| term | [`TermOfService`](#TermOfService) | Contains a termOfServiceObject. |\n| accepted | `bool` | Indicates whether or not the term of service was selected during registration |\n\n## Examples\n\nYou can view the complete example in the [example project] which resulted in the\ngif above\n\n### Basic example\n\n```dart\nimport 'package:flutter/material.dart';\nimport 'package:flutter_login/flutter_login.dart';\nimport 'dashboard_screen.dart';\n\nconst users = {\n 'dribbble@gmail.com': '12345',\n 'hunter@gmail.com': 'hunter',\n};\n\nclass LoginScreen extends StatelessWidget {\n const LoginScreen({super.key});\n\n Duration get loginTime =\u003e const Duration(milliseconds: 2250);\n\n Future\u003cString?\u003e _authUser(LoginData data) {\n debugPrint('Name: ${data.name}, Password: ${data.password}');\n return Future.delayed(loginTime).then((_) {\n if (!users.containsKey(data.name)) {\n return 'User not exists';\n }\n if (users[data.name] != data.password) {\n return 'Password does not match';\n }\n return null;\n });\n }\n\n Future\u003cString?\u003e _signupUser(SignupData data) {\n debugPrint('Signup Name: ${data.name}, Password: ${data.password}');\n return Future.delayed(loginTime).then((_) {\n return null;\n });\n }\n\n Future\u003cString\u003e _recoverPassword(String name) {\n debugPrint('Name: $name');\n return Future.delayed(loginTime).then((_) {\n if (!users.containsKey(name)) {\n return 'User not exists';\n }\n return null;\n });\n }\n\n @override\n Widget build(BuildContext context) {\n return FlutterLogin(\n title: 'ECORP',\n logo: const AssetImage('assets/images/ecorp-lightblue.png'),\n onLogin: _authUser,\n onSignup: _signupUser,\n onSubmitAnimationCompleted: () {\n Navigator.of(context).pushReplacement(MaterialPageRoute(\n builder: (context) =\u003e const DashboardScreen(),\n ));\n },\n onRecoverPassword: _recoverPassword,\n );\n }\n}\n```\n\n\u003cimg src=\"https://github.com/NearHuscarl/flutter_login/raw/master/demo/basic.png\" width=\"300\"\u003e\n\n\n\n### Basic example with sign in providers\n\n```dart\nimport 'package:flutter/material.dart';\nimport 'package:flutter_login/flutter_login.dart';\nimport 'dashboard_screen.dart';\n\nconst users = {\n 'dribbble@gmail.com': '12345',\n 'hunter@gmail.com': 'hunter',\n};\n\nclass LoginScreen extends StatelessWidget {\n const LoginScreen({super.key});\n\n Duration get loginTime =\u003e const Duration(milliseconds: 2250);\n\n Future\u003cString?\u003e _authUser(LoginData data) {\n debugPrint('Name: ${data.name}, Password: ${data.password}');\n return Future.delayed(loginTime).then((_) {\n if (!users.containsKey(data.name)) {\n return 'User not exists';\n }\n if (users[data.name] != data.password) {\n return 'Password does not match';\n }\n return null;\n });\n }\n\n Future\u003cString?\u003e _signupUser(SignupData data) {\n debugPrint('Signup Name: ${data.name}, Password: ${data.password}');\n return Future.delayed(loginTime).then((_) {\n return null;\n });\n }\n\n Future\u003cString\u003e _recoverPassword(String name) {\n debugPrint('Name: $name');\n return Future.delayed(loginTime).then((_) {\n if (!users.containsKey(name)) {\n return 'User not exists';\n }\n return null;\n });\n }\n\n @override\n Widget build(BuildContext context) {\n return FlutterLogin(\n title: 'ECORP',\n logo: const AssetImage('assets/images/ecorp-lightblue.png'),\n onLogin: _authUser,\n onSignup: _signupUser,\n \n loginProviders: \u003cLoginProvider\u003e[\n LoginProvider(\n icon: FontAwesomeIcons.google,\n label: 'Google',\n callback: () async {\n debugPrint('start google sign in');\n await Future.delayed(loginTime);\n debugPrint('stop google sign in'); \n return null;\n },\n ),\n LoginProvider(\n icon: FontAwesomeIcons.facebookF,\n label: 'Facebook',\n callback: () async { \n debugPrint('start facebook sign in');\n await Future.delayed(loginTime);\n debugPrint('stop facebook sign in'); \n return null;\n },\n ),\n LoginProvider(\n icon: FontAwesomeIcons.linkedinIn,\n callback: () async { \n debugPrint('start linkdin sign in');\n await Future.delayed(loginTime); \n debugPrint('stop linkdin sign in'); \n return null;\n },\n ),\n LoginProvider(\n icon: FontAwesomeIcons.githubAlt,\n callback: () async {\n debugPrint('start github sign in');\n await Future.delayed(loginTime);\n debugPrint('stop github sign in'); \n return null;\n },\n ),\n ],\n onSubmitAnimationCompleted: () {\n Navigator.of(context).pushReplacement(MaterialPageRoute(\n builder: (context) =\u003e const DashboardScreen(),\n ));\n },\n onRecoverPassword: _recoverPassword,\n );\n }\n}\n```\n\n\u003cimg src=\"https://github.com/NearHuscarl/flutter_login/raw/master/demo/login-with-provider.png\" width=\"300\"\u003e\n\n\n\n### Theming via `ThemeData`\n\nLogin theme can be customized indectly by using `ThemeData` like this\n\n```dart\n// main.dart\nimport 'package:flutter/material.dart';\nimport 'login_screen.dart';\n\nvoid main() =\u003e runApp(MyApp());\n\nclass MyApp extends StatelessWidget {\n @override\n Widget build(BuildContext context) {\n return MaterialApp(\n title: 'Login Demo',\n theme: ThemeData(\n primarySwatch: Colors.deepPurple,\n accentColor: Colors.orange,\n cursorColor: Colors.orange,\n textTheme: const TextTheme(\n headline3: TextStyle(\n fontFamily: 'OpenSans',\n fontSize: 45.0,\n color: Colors.orange,\n ),\n button: TextStyle(\n fontFamily: 'OpenSans',\n ),\n subtitle1: TextStyle(fontFamily: 'NotoSans'),\n bodyText2: TextStyle(fontFamily: 'NotoSans'),\n ),\n ),\n home: LoginScreen(),\n );\n }\n}\n\n// login_screen.dart\nimport 'package:flutter/material.dart';\nimport 'package:flutter_login/flutter_login.dart';\nimport 'dashboard_screen.dart';\n\nclass LoginScreen extends StatelessWidget {\n @override\n Widget build(BuildContext context) {\n return FlutterLogin(\n title: 'ECORP',\n logo: const AssetImage('assets/images/ecorp.png'),\n onLogin: (_) =\u003e Future(null),\n onSignup: (_) =\u003e Future(null),\n onSubmitAnimationCompleted: () {\n Navigator.of(context).pushReplacement(MaterialPageRoute(\n builder: (context) =\u003e const DashboardScreen(),\n ));\n },\n onRecoverPassword: (_) =\u003e Future(null),\n );\n }\n}\n```\n\n\u003cimg src=\"https://github.com/NearHuscarl/flutter_login/raw/master/demo/theme-data.png\" width=\"300\"\u003e\n\n### Custom labels\n\n```dart\nimport 'package:flutter/material.dart';\nimport 'package:flutter_login/flutter_login.dart';\nimport 'dashboard_screen.dart';\n\nclass LoginScreen extends StatelessWidget {\n const LoginScreen({super.key});\n\n @override\n Widget build(BuildContext context) {\n return FlutterLogin(\n title: 'ECORP',\n logo: const AssetImage('assets/images/ecorp.png'),\n onLogin: (_) =\u003e Future(null),\n onSignup: (_) =\u003e Future(null),\n onSubmitAnimationCompleted: () {\n Navigator.of(context).pushReplacement(MaterialPageRoute(\n builder: (context) =\u003e const DashboardScreen(),\n ));\n },\n onRecoverPassword: (_) =\u003e Future(null),\n messages: LoginMessages(\n userHint: 'User',\n passwordHint: 'Pass',\n confirmPasswordHint: 'Confirm',\n loginButton: 'LOG IN',\n signupButton: 'REGISTER',\n forgotPasswordButton: 'Forgot huh?',\n recoverPasswordButton: 'HELP ME',\n goBackButton: 'GO BACK',\n confirmPasswordError: 'Not match!',\n recoverPasswordDescription:\n 'Lorem Ipsum is simply dummy text of the printing and typesetting industry',\n recoverPasswordSuccess: 'Password rescued successfully',\n ),\n );\n }\n}\n\n```\n\n| Login/Signup | Password Recovery |\n|:--------------------------------------------:|:---------------------------------------------------:|\n| ![Login/Signup](demo/custom-label-login.png) | ![Password Recovery](demo/custom-label-recover.png) |\n\n### Theme customization\n\n```dart\n\nimport 'package:flutter/material.dart';\nimport 'package:flutter_login/flutter_login.dart';\nimport 'dashboard_screen.dart';\n\nclass LoginScreen extends StatelessWidget {\n const LoginScreen({super.key});\n\n @override\n Widget build(BuildContext context) {\n const inputBorder = BorderRadius.vertical(\n bottom: Radius.circular(10.0),\n top: Radius.circular(20.0),\n );\n\n return FlutterLogin(\n title: 'ECORP',\n logo: const AssetImage('assets/images/ecorp-lightgreen.png'),\n onLogin: (_) =\u003e Future(null),\n onSignup: (_) =\u003e Future(null),\n onSubmitAnimationCompleted: () {\n Navigator.of(context).pushReplacement(MaterialPageRoute(\n builder: (context) =\u003e const DashboardScreen(),\n ));\n },\n onRecoverPassword: (_) =\u003e Future(null),\n theme: LoginTheme(\n primaryColor: Colors.teal,\n accentColor: Colors.yellow,\n errorColor: Colors.deepOrange,\n titleStyle: const TextStyle(\n color: Colors.greenAccent,\n fontFamily: 'Quicksand',\n letterSpacing: 4,\n ),\n bodyStyle: const TextStyle(\n fontStyle: FontStyle.italic,\n decoration: TextDecoration.underline,\n ),\n textFieldStyle: const TextStyle(\n color: Colors.orange,\n shadows: [Shadow(color: Colors.yellow, blurRadius: 2)],\n ),\n buttonStyle: const TextStyle(\n fontWeight: FontWeight.w800,\n color: Colors.yellow,\n ),\n cardTheme: CardTheme(\n color: Colors.yellow.shade100,\n elevation: 5,\n margin: const EdgeInsets.only(top: 15),\n shape: ContinuousRectangleBorder(\n borderRadius: BorderRadius.circular(100.0)),\n ),\n inputTheme: InputDecorationTheme(\n filled: true,\n fillColor: Colors.purple.withOpacity(.1),\n contentPadding: EdgeInsets.zero,\n errorStyle: const TextStyle(\n backgroundColor: Colors.orange,\n color: Colors.white,\n ),\n labelStyle: const TextStyle(fontSize: 12),\n enabledBorder: UnderlineInputBorder(\n borderSide: BorderSide(color: Colors.blue.shade700, width: 4),\n borderRadius: inputBorder,\n ),\n focusedBorder: UnderlineInputBorder(\n borderSide: BorderSide(color: Colors.blue.shade400, width: 5),\n borderRadius: inputBorder,\n ),\n errorBorder: UnderlineInputBorder(\n borderSide: BorderSide(color: Colors.red.shade700, width: 7),\n borderRadius: inputBorder,\n ),\n focusedErrorBorder: UnderlineInputBorder(\n borderSide: BorderSide(color: Colors.red.shade400, width: 8),\n borderRadius: inputBorder,\n ),\n disabledBorder: const UnderlineInputBorder(\n borderSide: BorderSide(color: Colors.grey, width: 5),\n borderRadius: inputBorder,\n ),\n ),\n buttonTheme: LoginButtonTheme(\n splashColor: Colors.purple,\n backgroundColor: Colors.pinkAccent,\n highlightColor: Colors.lightGreen,\n elevation: 9.0,\n highlightElevation: 6.0,\n shape: BeveledRectangleBorder(\n borderRadius: BorderRadius.circular(10),\n ),\n // shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(5)),\n // shape: CircleBorder(side: BorderSide(color: Colors.green)),\n // shape: ContinuousRectangleBorder(borderRadius: BorderRadius.circular(55.0)),\n ),\n ),\n );\n }\n}\n```\n\n\u003cimg src=\"https://github.com/NearHuscarl/flutter_login/raw/master/demo/theme.png\" width=\"300\"\u003e\n\n## Inspiration\n* [VNPAY App Interactions](https://dribbble.com/shots/3829985-VNPAY-App-Interactions)\n* [Flat UI Login animated](https://dribbble.com/shots/1058688-Flat-UI-Login-animated)\n\n## License\n\n* MIT License\n\n[example project]: example/\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FNearHuscarl%2Fflutter_login","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FNearHuscarl%2Fflutter_login","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FNearHuscarl%2Fflutter_login/lists"}