Flutter Login and Sign up Authentication

Question

I'm new to flutter and i need to authenticate the login and sign up pages. I have the UI ready but i don't know how to authenticate the pages. I have a database ready in my phpAdmin

Answer 1

So you mean your form is not working? Please check the code which works for me with Firebase. Maybe it would be helpful

import 'package:flutter/material.dart';

class Login extends StatefulWidget {
  const Login({Key? key}) : super(key: key);

  @override
  State<Login> createState() => _LoginState();
}

class _LoginState extends State<Login> {
  final _formKey = GlobalKey<FormState>();

  TextEditingController clientEmail = TextEditingController();
  TextEditingController clientPassword = TextEditingController();

  bool _obscureText = true;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('LoginView'),
          centerTitle: true,
        ),
        body: SingleChildScrollView(
          child: Form(
            key: _formKey,
            child: Column(
              children: [
                SizedBox(
                  height: 50,
                ),
                Padding(
                  padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
                  child: Card(
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(15.0),
                    ),
                    elevation: 3,
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: TextFormField(
                        decoration: InputDecoration(
                          prefixIcon: Icon(Icons.mail),
                          border: InputBorder.none,
                          labelText: 'E-Mail',
                          labelStyle: TextStyle(
                              fontSize: 12, fontWeight: FontWeight.bold),
                        ),
                        onSaved: (value) {
                          clientEmail = value as TextEditingController;
                        },
                        controller: clientEmail,
                        textInputAction: TextInputAction.next,
                        validator: ((value) {
                          if (value!.isEmpty || !value.contains('@')) {
                            return 'Please enter E-Mail Address ';
                          }
                          return null;
                        }),
                      ),
                    ),
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.fromLTRB(8, 0, 8, 8),
                  child: Card(
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(15.0),
                    ),
                    elevation: 3,
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: TextFormField(
                        decoration: InputDecoration(
                          border: InputBorder.none,
                          prefixIcon: Icon(Icons.lock),
                          suffixIcon: GestureDetector(
                            onTap: () {
                              setState(() {
                                _obscureText = !_obscureText;
                              });
                            },
                            child: Icon(_obscureText
                                ? Icons.visibility
                                : Icons.visibility_off),
                          ),
                          labelText: 'Password',
                          labelStyle: TextStyle(
                              fontSize: 12, fontWeight: FontWeight.bold),
                        ),
                        onSaved: (value) {
                          clientPassword = value as TextEditingController;
                        },
                        obscureText: _obscureText,
                        controller: clientPassword,
                        textInputAction: TextInputAction.next,
                        validator: ((value) {
                          if (value!.isEmpty || value.length < 7) {
                            return 'Please enter your Password, min 7 digits';
                          }
                          return null;
                        }),
                      ),
                    ),
                  ),
                ),
                ElevatedButton(
                    onPressed: () {
                      if (_formKey.currentState!.validate()) {
                        // here would be your function which saves the data to yout database
                        //for example
                        // addUser();
                      }
                    },
                    child: Text('Login')),
              ],
            ),
          ),
        ));
  }
}