Flutter - Login with firebase

To create a login user interface (UI) in Flutter, you can follow these steps:

1. First, create a new Flutter project and add the firebase_auth package to your pubspec.yaml file. This package will allow you to authenticate the user using Firebase.
2. Create a new file called login_screen.dart and define a LoginScreen widget. This widget will contain the UI for your login screen.
3. In the build method of the LoginScreen widget, use a Scaffold widget as the root of your widget tree. This will provide you with a default app bar.
4. Add a TextField widget for the user to enter their email address and a TextField widget for the user to enter their password.
5. Add a login button below the text fields. When the user clicks the login button, use the firebase_auth package to authenticate the user with their email and password.
6. If the login is successful, navigate to the home screen of your app. If the login fails, display an error message to the user.

Here is some example code to get you started:

import 'package:flutter/material.dart';
import 'package:firebase_auth/firebase_auth.dart';

class LoginScreen extends StatefulWidget {
  static const String id = 'login_screen';

  @override
  _LoginScreenState createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {
  final _auth = FirebaseAuth.instance;
  String email;
  String password;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Flutter Login'),
      ),
      body: Padding(
        padding: EdgeInsets.all(16.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: <Widget>[
            TextField(
              onChanged: (value) {
                email = value;
              },
              decoration: InputDecoration(
                hintText: 'Enter your email',
              ),
            ),
            SizedBox(
              height: 8.0,
            ),
            TextField(
              onChanged: (value) {
                password = value;
              },
              obscureText: true,
              decoration: InputDecoration(
                hintText: 'Enter your password',
              ),
            ),
            SizedBox(
              height: 24.0,
            ),
            ButtonTheme(
              height: 40.0,
              child: RaisedButton(
                onPressed: () async {
                  try {
                    final user = await _auth.signInWithEmailAndPassword(
                        email: email, password: password);
                    if (user != null) {
                      Navigator.pushNamed(context, HomeScreen.id);
                    }
                  } catch (e) {
                    print(e);
                  }
                },
                child: Text('Log In'),
              ),
            ),
          ],
        ),
      ),
    );
  }
}