dania/finger_print_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

auth form is finished

Browse Source
This commit is contained in:
Daniah Ayad Al-sultani
2025-11-29 15:19:03 +03:00
parent b50c2b578b
commit 32894a5a7d
5 changed files with 207 additions and 146 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
lib/screens/auth_screen.dart
View File

@@ -1,7 +1,6 @@
import 'package:flutter/material.dart';
import '../widgets/app_background.dart';
import '../widgets/auth_form.dart';
import '../widgets/onboarding_button.dart';
class AuthScreen extends StatelessWidget {
const AuthScreen({super.key});
@@ -9,18 +8,29 @@ class AuthScreen extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
resizeToAvoidBottomInset: true,
body: AppBackground(
child: Center(
child: Text(
"Auth Screen",
style: TextStyle(
color: Colors.white,
fontSize: 26,
fontWeight: FontWeight.bold,
),
child: SafeArea(
child: Column(
children: [
const SizedBox(height: 60),
// Logo
Center(
child: Image.asset("assets/images/logo2.png", width: 200),
),
// const SizedBox(height: 15),
// Form - taking remaining space and centered
Expanded(
child: Center(
child: SingleChildScrollView(
child: const AuthForm(),
),
),
),
],
),
),
),
);
}
}
}

258
lib/widgets/auth_form.dart
View File

@@ -1,138 +1,176 @@
import 'package:flutter/material.dart';
import 'onboarding_button.dart';
class AuthForm extends StatefulWidget {
const AuthForm({super.key, required this.onSubmit});
final VoidCallback? onSubmit;
final VoidCallback onSubmit;
const AuthForm({super.key, this.onSubmit});
@override
State<AuthForm> createState() => _AuthFormState();
}
class _AuthFormState extends State<AuthForm> {
bool _obscure = true;
@override
Widget build(BuildContext context) {
return Directionality(
textDirection: TextDirection.rtl,
child: Container(
margin: const EdgeInsets.symmetric(horizontal: 28),
padding: const EdgeInsets.symmetric(horizontal: 22, vertical: 26),
decoration: BoxDecoration(
color: const Color(0xA6F4FFFD), // Light mint white
borderRadius: BorderRadius.circular(26),
boxShadow: [
BoxShadow(
color: const Color(0x803EFECB), // green glow shadow
blurRadius: 35,
spreadRadius: -5,
child: Stack(
alignment: Alignment.center,
children: [
// Border container - decorative element behind the form
Container(
width: 360,
constraints: const BoxConstraints(
minHeight: 500,
maxHeight: 580, // Allows shrinking when keyboard opens
),
decoration: BoxDecoration(
color: Colors.transparent,
borderRadius: BorderRadius.circular(32),
border: Border.all(
color: const Color(0xDD00C28E),
width: 1,
),
),
],
border: Border.all(
color: const Color(0xFF3EFECB), // Dark border
width: 2,
),
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
// main lable
const Text(
"تسجيل دخول",
style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.w700,
color: Color(0xFF00382A),
),
),
const SizedBox(height: 24),
//lable
const Text(
"اسم المستخدم",
style: TextStyle(fontSize: 16, color: Colors.black87
),
),
const SizedBox(height: 6),
//username field
Container(
decoration: BoxDecoration(
color: const Color(0xDEDEDEDE),
borderRadius: BorderRadius.circular(7),
boxShadow: [
BoxShadow(
color: Colors.black26,
blurRadius: 4,
offset: Offset(0, 2),
),
],
),
child: const TextField(
decoration: InputDecoration(
hintText: "اسم المستخدم",
border: InputBorder.none,
contentPadding: EdgeInsets.symmetric(
horizontal: 16,
vertical: 12,
),
// Main form container
Container(
width: 340,
padding: const EdgeInsets.symmetric(horizontal: 25, vertical: 38),
decoration: BoxDecoration(
color: const Color(0xFFEEFFFA),
borderRadius: BorderRadius.circular(28),
boxShadow: const [
BoxShadow(
color: Colors.black26,
blurRadius: 10,
offset: Offset(0, 5),
),
),
],
),
const SizedBox(height: 22),
/// PASSWORD LABEL
const Text(
"كلمة المرور",
style: TextStyle(
fontSize: 15,
color: Colors.black87,
),
),
/// PASSWORD FIELD
Container(
decoration: BoxDecoration(
color: const Color(0xFFE3E3E3),
borderRadius: BorderRadius.circular(12),
boxShadow: [
BoxShadow(
color: Colors.black26,
blurRadius: 4,
offset: Offset(0, 2),
),
],
),
child: TextField(
obscureText: _obscure,
decoration: InputDecoration(
hintText: "كلمة المرور",
border: InputBorder.none,
contentPadding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
suffixIcon: IconButton(
icon: Icon(
_obscure ? Icons.visibility : Icons.visibility_off,
color: Colors.black54,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisSize: MainAxisSize.min,
children: [
/// Title
const Center(
child: Text(
"تسجيل دخول",
style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.bold,
color: Colors.black87,
),
onPressed: () {
setState(() => _obscure = !_obscure);
},
),
),
),
const SizedBox(height: 34),
/// Username Label
const Align(
alignment: Alignment.centerRight,
child: Text(
"اسم المستخدم",
style: TextStyle(
fontSize: 16,
color: Colors.black87,
),
),
),
const SizedBox(height: 8),
_buildField(
hint: "اسم المستخدم",
obscure: false,
),
const SizedBox(height: 30),
/// Password Label
const Align(
alignment: Alignment.centerRight,
child: Text(
"كلمة المرور",
style: TextStyle(
fontSize: 16,
color: Colors.black87,
),
),
),
const SizedBox(height: 8),
_buildField(
hint: "كلمة المرور",
obscure: _obscure,
hasEye: true,
),
const SizedBox(height: 100), // Restored original spacing
Center(
child: OnboardingButton(
text: "تسجيل دخول",
backgroundColor: const Color.fromARGB(239, 35, 87, 74),
onPressed: widget.onSubmit,
),
),
const SizedBox(height: 40),
],
),
),
],
),
);
}
const SizedBox(height: 26),
],
Widget _buildField({
required String hint,
required bool obscure,
bool hasEye = false,
}) {
return Container(
decoration: BoxDecoration(
color: const Color(0xDEDEDEDE),
borderRadius: BorderRadius.circular(7),
boxShadow: const [
BoxShadow(
color: Colors.black26,
blurRadius: 6,
offset: Offset(0, 2),
),
],
),
child: TextField(
obscureText: obscure,
textAlign: TextAlign.right,
style: const TextStyle(fontSize: 16),
decoration: InputDecoration(
hintText: hint,
hintStyle: const TextStyle(color: Colors.black54),
border: InputBorder.none,
contentPadding:
const EdgeInsets.symmetric(vertical: 16, horizontal: 16),
suffixIcon: hasEye
? IconButton(
icon: Icon(
obscure ? Icons.visibility_off : Icons.visibility,
color: Colors.black54,
),
onPressed: () {
setState(() => _obscure = !obscure);
},
)
: null,
),
),
);
}
}
}

56
lib/widgets/onboarding_button.dart
View File

@@ -3,29 +3,51 @@ import 'package:flutter/material.dart';
class OnboardingButton extends StatelessWidget {
final String text;
final VoidCallback? onPressed;
final Color backgroundColor;
const OnboardingButton({super.key, required this.text, this.onPressed});
const OnboardingButton({
super.key,
required this.text,
this.onPressed,
this.backgroundColor = const Color(0xFF2D2D2D),
});
@override
Widget build(BuildContext context) {
return ElevatedButton(
onPressed: onPressed ?? () {},
style: ElevatedButton.styleFrom(
backgroundColor: const Color(0xFF2D2D2D),
foregroundColor: Colors.white,
padding: const EdgeInsets.symmetric(horizontal: 80, vertical: 10),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(14)),
elevation: 0,
return Container(
decoration: BoxDecoration(
boxShadow: [
BoxShadow(
color: const Color.fromARGB(59, 59, 59, 59),
spreadRadius: 1,
blurRadius: 14,
offset: const Offset(0, 4),
),
],
),
child: Text(
text,
style: const TextStyle(
fontFamily: 'AbdElRady',
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.w700,
child: ElevatedButton(
onPressed: onPressed,
style: ElevatedButton.styleFrom(
backgroundColor: backgroundColor,
foregroundColor: Colors.white,
disabledForegroundColor: Colors.white,
disabledBackgroundColor: backgroundColor,
padding: const EdgeInsets.symmetric(horizontal: 80, vertical: 10),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16),
),
elevation: 8, // Increased elevation for more prominent shadow
shadowColor: const Color(0x47000000), // More defined shadow color
),
child: Text(
text,
style: const TextStyle(
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.w600,
),
),
),
);
}
}
}

8
pubspec.lock
View File

@@ -81,14 +81,6 @@ packages:
url: "https://pub.dev"
source: hosted
version: "1.0.2"
cupertino_icons:
dependency: "direct main"
description:
name: cupertino_icons
sha256: ba631d1c7f7bef6b729a622b7b752645a2d076dba9976925b8f25725a30e1ee6
url: "https://pub.dev"
source: hosted
version: "1.0.8"
fake_async:
dependency: transitive
description:

1
pubspec.yaml
View File

@@ -10,7 +10,6 @@ environment:
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^1.0.8
flutter_svg: ^2.0.9
dev_dependencies: