Best 6 Flutter Login Screen Design

Overview

Flutter Login Home Animation

A new open-source Flutter project that enables the developer to quickly get started with the Flutter animation and application development. Here’s a GIF that shows a Flutter app that I created. It is a rebuild version of a UI design that I came across on Dribbble.

This project contains the basic features of Flutter Animation that are required to build an amazing Flutter application.

You can also checkout the flow of animation and steps to design it briefly at our medium article Flutter Login Animation

Demo

Demo

Getting Started

Note: Make sure your Flutter environment is setup.

Installation

In the command terminal, run the following commands:

$ git clone https://github.com/GeekyAnts/flutter-login-home-animation/tree/master/
$ cd Flutter-LoginAnimation/dribbbledanimation
$ flutter run

Simulate for iOS

Method One

Open the project in Xcode from ios/Runner.xcodeproj.
Hit the play button.

Method Two

Run the following command in your terminal.
$ open -a Simulator
$ flutter run

Simulate for Android

Make sure you have an Android emulator installed and running.
Run the following command in your terminal.
$ flutter run
Check out Flutter’s online documentation for help getting start with your Flutter Animation project.
Comments
  • Missed library

    Missed library

    Hi,

    I was testing your project and I got this:

    Andres-MBP:flutter_tests andre$ git clone https://github.com/GeekyAnts/flutter-login-home-animation
    Cloning into 'flutter-login-home-animation'...
    remote: Counting objects: 149, done.
    remote: Compressing objects: 100% (119/119), done.
    remote: Total 149 (delta 16), reused 143 (delta 10), pack-reused 0
    Receiving objects: 100% (149/149), 3.37 MiB | 2.29 MiB/s, done.
    Resolving deltas: 100% (16/16), done.
    Andres-MBP:flutter_tests andre$ cd flutter-login-home-animation/dribbbledanimation/
    Andres-MBP:dribbbledanimation andre$ flutter run
    Running "flutter packages get" in dribbbledanimation...      3.5s
    Your application could not be compiled, because its dependencies could not be established.
    The following Dart file:
      /Users/andre/git/flutter_tests/flutter-login-home-animation/dribbbledanimation/lib/main.dart
    ...refers, in an import, to the following library:
      package:dribbbledanimation/Routes.dart
    That library is in a package that is not known. Maybe you forgot to mention it in your pubspec.yaml file?
    

    Regards

    opened by aemitos 2
  • This template is slow

    This template is slow

    I downloaded this template and ran it (without any change) on Nexus 5X. But animations and UI transitions are slow. My command was 'flutter run'

    And again I installed application using 'flutter install' command. But still it is slow.

    Is there any special thing I have to do?

    opened by gambheera 1
  • Build not working

    Build not working

    Hi there, The index.dart under Screen/Home has error: As following.

    • Target of URI doesn't exist: 'package:intl/intl.dart'.
    • Undefined class 'DateFormat.MMMM'.

    Sorry that I've already tried to google this two problems, but can't find solution.

    I git cloned the dictionary, got the whole code, then compile return these 2 errors. Dart: 2.13.2 Flutter: Channel Beta, V0.4.4

    Thanks,

    opened by cityinthepark 0
  • Real world use case

    Real world use case

    So being new to Dart I am having trouble processing this code. At what point do you grab the username and password process the credentials and stop the navigation if they are wrong and display an error message?

    I also encountered this error: _onWillPop is returning the error: Error: A value of type 'Future<bool?>' can't be assigned to a variable of type 'Future' because 'bool?' is nullable and 'bool' isn't.

    opened by forexstudies 0
  • settings.isInitialRoute isnt defined in RouteSettings

    settings.isInitialRoute isnt defined in RouteSettings

    I tried to run this project but stumbled upon this.

    in Routes.dart:

    if (settings.isInitialRoute) return child;
    

    there is this error:

    Compiler message: lib/Routes.dart:37:18: Error: The getter 'isInitialRoute' isn't defined for the class 'RouteSettings'.

    • 'RouteSettings' is from 'package:flutter/src/widgets/navigator.dart' ('/C:/fluttersdk/packages/flutter/lib/src/widgets/navigator.dart'). Try correcting the name to the name of an existing getter, or defining a getter or field named 'isInitialRoute'. if (settings.isInitialRoute) return child; ^^^^^^^^^^^^^^
    opened by axilaris 1
  • HomePage pushed multiple times

    HomePage pushed multiple times

    When I press "Sign In" I am redirected to the Homepage as expected. After I hit the back button and "Sign In" again the Homepage is pushed multiple times and I need to hit "back" quite often to get back to the Login Screen.

    I think this is due to reusing the buttonController over and over again without resetting it. Adding buttonController.reset() here fixes the error at least for me.

    opened by surr34 0
Owner
GeekyAnts
GeekyAnts
Provides login screen with login/signup functionalities to help speed up development

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

Near Huscarl 945 Nov 2, 2021
Beautiful-Login-Design - A design challenge made in flutter + custompainter

Login Design This little project was proposed in [Flutter & Dart en Español] gro

Juan Suarez 10 Nov 3, 2022
Basic login and signup screen designed in flutter

flutter_login_signup Simple basic authentication app designed in flutter. App design is based on Login/Register Design designed by Frank Arinze Downlo

Sonu Sharma 551 Jan 6, 2023
dart based login-screen that connects with Firebase Auth to enable users to sign-in

A Flutter / Firebase login screen A simple flutter/dart based login-screen that connects with Firebase Auth to enable users to sign-in/up with Email o

Pamela Nyasha Muzoma 2 Nov 20, 2021
A Flutter package to custom splash screen like change logo icon, logo animation, and splash screen background color.

Custom Splash Screen A Flutter package to custom splash screen: change logo icon, logo animation, and splash screen background color. (Custom from ani

tranhuycong 78 Sep 6, 2022
An awesome list that curates the best Flutter libraries, tools, tutorials, articles and more.

Flutter is Google’s UI toolkit for building beautiful, natively compiled applications for mobile, web, and desktop from a single codebase. If you appr

Robert Felker 44.6k Dec 30, 2022
Login Page UI Design and Animation For Flutter

Flutter Beautiful Login Page UI Design and Animation - Day 14 class Afgprogramme

Behruz Hurramov 0 Dec 24, 2021
Domain-Driven Design + Parse Server For FlutterDomain-Driven Design + Parse Server For Flutter

Domain-Driven Design + Parse Server Install Parse SDK on Flutter project and then update .env file PARSE_APPLICATION_ID=YOUR_APP_ID_HERE PARSE_CLIENT_

Long Hoàng 19 Nov 18, 2022
Flutter UI Login App with Figma

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

Trần Văn Nguyên 1 Nov 17, 2021
A Flutter project for login and sign up

loginsignup A new Flutter project for login and sign up. Getting Started This project is a starting point for a Flutter application. A few resources t

Faysal Neowaz 8 Dec 27, 2022
A Flutter Login Page UI project

flutter_login_ui A new Flutter Login Page UI project. Getting Started This project is a starting point for a Flutter application. A few resources to g

Jakariya (হাদি) 1 Dec 4, 2021
Mobile app onboarding, Login, Signup page with #flutter.

Welcome page, Login Page and Sign up page - Flutter UI Watch it on YouTube Packages we are using: flutter_svg: link We design 3 screens first one is a

Abu Anwar 1k Jan 6, 2023
Login and Sign up Screens UI For Flutter

Login and Sign up Screens UI A new Flutter application. Getting Started This project is a starting point for a Flutter application. A few resources to

Mohit rao 6 Nov 21, 2022
A simple login UI written in flutter

login_ui A simple Flutter login ui. Sign in screen Sign up screen

Mohammad Saleh 7 Nov 2, 2022
A signin/login project with Flutter and Firebase

SignIn_Firebase This is a signin/login project.Here some of screenshot in my pro

Sadia Afrin 0 Dec 19, 2021
Phone number authentication + OTP login page built with @flutter 😍

The Gorgeous Otp A login page built with flutter inspired by a design found on Uplabs Login Screen OTP Screen Tools This project uses the phone connec

Hugo EXTRAT 179 Nov 22, 2022
Ishop - Flutter ecommerce application concept, onboarding, login , sign up and marketplace

Ishop Flutter ecommerce application concept, onboarding, login , sign up and mar

Sam M.K 0 Dec 31, 2021
Flutter Login interface using basic widgets such as Row, Column

Login UI - Flutter Descrição do Projeto ?? Interface de login utilizando widgets

null 2 Oct 25, 2022
giao diện login facebook

buoi1 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 is

null 0 Nov 4, 2021