I’ll describe how to develop a login form in flutter using the dart package in this blog. Therefore, I’ll open “lib/main.dart” in an editor before I create a project and import-

importing ‘package:flutter/material.dart’

Use a stateless widget after that for the title and colour. the use of stateful widgets for complete functionality and design after that. With the aid of InputDecoration, I am using a background image in this application to create a card within a container. I’m making two parts for input. Similarly, Username & Password, and make a button that reads “Login.” Here is a code mention.

	import 'dart:convert';
	import 'package:flutter/material.dart';
	import 'package:http/http.dart' as http;
	import 'package:my_hospital_now_doctor/pages/dashboard.dart';
	import 'package:my_hospital_now_doctor/pages/forgot_password.dart';
	import 'package:my_hospital_now_doctor/services/auth_services.dart';
	// import 'package:my_hospital_now_doctor/pages/dashboard.dart';
	import 'package:my_hospital_now_doctor/pages/home_page.dart';
	import 'package:my_hospital_now_doctor/pages/register_page.dart';
	import 'package:my_hospital_now_doctor/services/auth_services.dart';
	import 'package:my_hospital_now_doctor/services/globals.dart';
	import 'package:shared_preferences/shared_preferences.dart';
	import '../rounded_button.dart';
	class Loginpage extends StatefulWidget {
	const Loginpage({Key key}) : super(key: key);
	@override
	State<Loginpage> createState() => _LoginpageState();
	}
	class _LoginpageState extends State<Loginpage> {
	String _email = '';
	String _password = '';
	AuthServices authServices = AuthServices();
	bool _isPasswordVisible = false;
	set _errorMessage(String _errorMessage) {}
	loginPress() async {
	if (_email.isNotEmpty && _password.isNotEmpty) {
	http.Response response = await authServices.login(_email, _password);
	Map responseMap = json.decode(response.body);
	print(response.statusCode);
	if (response.statusCode == 200) {
	final prefs = await SharedPreferences.getInstance();
	final key = 'token';
	final value = prefs.get(key) ?? 0;
	if (value != 0) {
	Navigator.push(
	context,
	MaterialPageRoute(
	builder: (BuildContext context) => Dashboard(),
	));
	} else {
	var getData = json.decode(response.body);
	final prefs = await SharedPreferences.getInstance();
	final key = 'token';
	final value = getData["success"]["token"];
	prefs.setString(key, value);
	final pemail = 'email';
	final pvalue = _email;
	prefs.setString(pemail, pvalue);
	if (value != 0) {
	Navigator.push(
	context,
	MaterialPageRoute(
	builder: (BuildContext context) => Dashboard(),
	));
	}
	}
	} else {
	errorSnackBar(context, 'Incorrect email or password');
	}
	} else {
	errorSnackBar(context, 'enter all required fields');
	}
	}
	@override
	Widget build(BuildContext context) {
	return Scaffold(
	appBar: AppBar(
	backgroundColor: Colors.blueAccent,
	centerTitle: true,
	elevation: 0,
	title: const Text(
	'Login',
	style: TextStyle(
	fontSize: 20,
	fontWeight: FontWeight.bold,
	),
	),
	),
	body: Padding(
	padding: const EdgeInsets.symmetric(horizontal: 20),
	child: Column(
	children: [
	const SizedBox(
	height: 20,
	),
	TextField(
	decoration: const InputDecoration(
	hintText: 'Enter your email',
	),
	onChanged: (value) {
	_email = value;
	},
	),
	const SizedBox(
	height: 30,
	),
	TextField(
	obscureText: !_isPasswordVisible,
	decoration: InputDecoration(
	hintText: 'Enter your password',
	suffixIcon: GestureDetector(
	onTap: () {
	setState(() {
	_isPasswordVisible = !_isPasswordVisible;
	});
	},
	child: Icon(
	_isPasswordVisible
	? Icons.visibility
	: Icons.visibility_off,
	),
	),
	),
	onChanged: (value) {
	_password = value;
	},
	),
	const SizedBox(
	height: 15,
	), // Added SizedBox for spacing
	Align(
	alignment: Alignment.centerRight,
	child: GestureDetector(
	onTap: () {
	Navigator.push(
	context,
	MaterialPageRoute(
	builder: (BuildContext context) => ForgotPassword(),
	),
	);
	},
	child: Text(
	'Forgot Password?',
	style: TextStyle(
	fontSize: 15.0,
	color: Colors.blue, // Change color as desired
	),
	),
	),
	),
	const SizedBox(
	height: 30,
	),
	RoundedButton(
	btnText: 'LOG IN',
	onBtnPressed: () => loginPress(),
	),
	const SizedBox(
	height: 20,
	), // Added SizedBox for spacing
	GestureDetector(
	onTap: () {
	Navigator.push(
	context,
	MaterialPageRoute(
	builder: (BuildContext context) => RegisterPage(),
	),
	);
	},
	child: Text(
	"Don't have an account? Sign up",
	style: TextStyle(
	fontSize: 18.0,
	color: Colors.blue, // Change color as desired
	),
	),
	),
	],
	),
	),
	);
	}
	}

view raw gistfile1.txt hosted with by GitHub