import 'package:flutter/material.
dart';
void main() => runApp(LoginUI());
class LoginUI extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Login Page',
debugShowCheckedModeBanner: false,
home: LoginPage(),
);
}
}
class LoginPage extends StatefulWidget {
@override
_LoginPageState createState() => _LoginPageState();
}
class _LoginPageState extends State<LoginPage> {
final _formKey = GlobalKey<FormState>();
final _emailController = TextEditingController();
final _passwordController = TextEditingController();
bool rememberMe = false;
void _login() {
if (_formKey.currentState!.validate()) {
String email = _emailController.text.trim();
String password = _passwordController.text.trim();
if (email == '[email protected]' && password == '123456') {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Login Successful ')),
);
} else {
ScaffoldMessenger.of(context).showSnackBar(
const SnackBar(content: Text('Invalid email or password ')),
);
}
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
colors: [Color(0xFF8e44ad), Color(0xFF3498db)],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
),
child: Center(
child: SingleChildScrollView(
child: Column(
children: [
CircleAvatar(
radius: 40,
backgroundColor: Colors.white.withOpacity(0.2),
child: const Icon(Icons.person, size: 50, color: Colors.white),
),
const SizedBox(height: 20),
Container(
margin: const EdgeInsets.symmetric(horizontal: 24),
padding: const EdgeInsets.all(24),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
borderRadius: BorderRadius.circular(20),
),
child: Form(
key: _formKey,
child: Column(
children: [
TextFormField(
controller: _emailController,
style: const TextStyle(color: Colors.white),
decoration: InputDecoration(
hintText: 'Email ID',
hintStyle: const TextStyle(color: Colors.white70),
prefixIcon: const Icon(Icons.email, color: Colors.white),
filled: true,
fillColor: Colors.white.withOpacity(0.1),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
borderSide: BorderSide.none,
),
),
validator: (value) {
if (value == null || value.isEmpty || !value.contains('@')) {
return 'Enter a valid email';
}
return null;
},
),
const SizedBox(height: 16),
TextFormField(
controller: _passwordController,
obscureText: true,
style: const TextStyle(color: Colors.white),
decoration: InputDecoration(
hintText: 'Password',
hintStyle: const TextStyle(color: Colors.white70),
prefixIcon: const Icon(Icons.lock, color: Colors.white),
filled: true,
fillColor: Colors.white.withOpacity(0.1),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(10),
borderSide: BorderSide.none,
),
),
validator: (value) {
if (value == null || value.length < 6) {
return 'Password must be at least 6 characters';
}
return null;
},
),
const SizedBox(height: 16),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
children: [
Checkbox(
value: rememberMe,
onChanged: (value) {
setState(() {
rememberMe = value!;
});
},
activeColor: Colors.white,
checkColor: Colors.black,
),
const Text('Remember me', style: TextStyle(color: Colors.white)),
],
),
TextButton(
onPressed: () {},
child: const Text('Forgot Password?', style: TextStyle(color: Colors.white70)),
),
],
),
const SizedBox(height: 10),
SizedBox(
width: double.infinity,
child: ElevatedButton(
onPressed: _login,
style: ElevatedButton.styleFrom(
backgroundColor: Colors.white.withOpacity(0.3),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
padding: const EdgeInsets.symmetric(vertical: 16),
),
child: const Text(
'LOGIN',
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
),
),
),
],
),
),
),
],
),
),
),
),
);
}
}