fisrt three screens

This commit is contained in:
Daniah Ayad Al-sultani
2025-11-27 16:21:33 +03:00
commit b50c2b578b
167 changed files with 5993 additions and 0 deletions

19
lib/main.dart Normal file
View File

@@ -0,0 +1,19 @@
import 'package:flutter/material.dart';
import 'package:flutter_native_splash/flutter_native_splash.dart';
import 'screens/splash_screen.dart';
void main() {
WidgetsBinding widgetsBinding = WidgetsFlutterBinding.ensureInitialized();
FlutterNativeSplash.preserve(widgetsBinding: widgetsBinding);
runApp(const CodaApp());
}
class CodaApp extends StatelessWidget {
const CodaApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(debugShowCheckedModeBanner: false, home: SplashScreen());
}
}

View File

@@ -0,0 +1,26 @@
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});
@override
Widget build(BuildContext context) {
return Scaffold(
body: AppBackground(
child: Center(
child: Text(
"Auth Screen",
style: TextStyle(
color: Colors.white,
fontSize: 26,
fontWeight: FontWeight.bold,
),
),
),
),
);
}
}

View File

@@ -0,0 +1,154 @@
import 'dart:async';
import 'package:coda_project/screens/auth_screen.dart';
import 'package:flutter/material.dart';
import '../widgets/onboarding_page.dart';
import '../widgets/onboarding_button.dart';
class OnboardingScreen extends StatefulWidget {
const OnboardingScreen({super.key});
@override
State<OnboardingScreen> createState() => _OnboardingScreenState();
}
class _OnboardingScreenState extends State<OnboardingScreen> {
final PageController controller = PageController();
int index = 0;
@override
void initState() {
super.initState();
// auto slide
Timer.periodic(const Duration(seconds: 4), (timer) {
if (!mounted) return;
int next = index == 1 ? 0 : index + 1;
controller.animateToPage(
next,
duration: const Duration(milliseconds: 600),
curve: Curves.easeInOut,
);
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(
children: [
/// BACKGROUND GRADIENT (base layer)
Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
stops: [0.0, 0.45, 0.75, 1.0],
colors: [
Color(0xFF2E2E2E),
Color(0xFF00271D),
Color(0xFF005841),
Color.fromARGB(176, 62, 254, 203),
],
),
),
),
/// BLURRED CIRCLE (subtle rounded glow)
Positioned(
bottom: -120,
left: -60,
right: -60,
child: Container(
height: 300,
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Color.fromARGB(
0,
62,
254,
203,
), // same green with opacity
boxShadow: [
BoxShadow(
color: Color.fromARGB(
69,
62,
254,
142,
), // stronger outer glow
blurRadius: 60,
spreadRadius: 100,
),
],
),
),
),
Column(
children: [
const SizedBox(height: 70),
Image.asset("assets/images/logo2.png", width: 200),
/// PAGEVIEW (SVG + TEXT ONLY)
Expanded(
child: PageView(
physics: BouncingScrollPhysics(),
controller: controller,
onPageChanged: (i) => setState(() => index = i),
children: const [
OnboardingPage(
imagePath: "assets/images/Onboarding1.svg",
text:
"سجل دخولك وخروجك بسهولة وتابع دوامك\nيومياً بدون تعقيد",
),
OnboardingPage(
imagePath: "assets/images/Onboarding2.svg",
text:
"اعرف تفاصيل راتبك وقدّم طلب الإجازة\nوتابع حالته بكل شفافية",
),
],
),
),
Padding(
padding: const EdgeInsets.only(bottom: 40),
child: OnboardingButton(
text: "تسجيل دخول",
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => const AuthScreen(),
),
);
},
),
),
/// DOTS INDICATOR
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: List.generate(2, (i) {
bool active = i == index;
return AnimatedContainer(
duration: const Duration(milliseconds: 300),
margin: const EdgeInsets.symmetric(horizontal: 4),
width: 10,
height: 10,
decoration: BoxDecoration(
color: active ? Colors.white : Colors.white60,
borderRadius: BorderRadius.circular(50),
),
);
}),
),
const SizedBox(height: 100),
],
),
],
),
);
}
}

View File

@@ -0,0 +1,40 @@
import 'package:flutter/material.dart';
import 'package:flutter_native_splash/flutter_native_splash.dart';
import 'onboarding_screen.dart';
class SplashScreen extends StatefulWidget {
const SplashScreen({super.key});
@override
State<SplashScreen> createState() => _SplashScreenState();
}
class _SplashScreenState extends State<SplashScreen> {
@override
void initState() {
super.initState();
FlutterNativeSplash.remove();
Future.delayed(const Duration(seconds: 2), () {
Navigator.pushReplacement(
context,
MaterialPageRoute(builder: (_) => OnboardingScreen()),
);
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage("assets/images/splash.png"),
fit: BoxFit.cover,
),
),
child: Center(child: Image.asset("assets/images/logo.png", width: 200)),
),
);
}
}

View File

@@ -0,0 +1,74 @@
import 'package:flutter/material.dart';
class AppBackground extends StatelessWidget {
final Widget child;
const AppBackground({super.key, required this.child});
@override
Widget build(BuildContext context) {
return Stack(
children: [
/// 1⃣ BASE GRADIENT (Exact Figma: #434343 -> #00382A)
Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Color.fromARGB(255, 41, 41, 41), // top dark gray
Color.fromARGB(255, 0, 20, 15), // bottom deep green
],
),
),
),
Positioned(
top: -250,
left: 100,
right: -200,
child: Container(
height: 300,
decoration: const BoxDecoration(
shape: BoxShape.circle,
// very soft inner fill
color: Color.fromARGB(0, 62, 254, 203),
boxShadow: [
BoxShadow(
// wide soft bloom
color: Color.fromARGB(69, 62, 254, 190),
blurRadius: 140,
spreadRadius: 160,
),
],
),
),
),
Positioned(
bottom: 100,
left: -140,
right: -120,
child: Container(
height: 320,
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Color.fromARGB(0, 62, 254, 203),
boxShadow: [
BoxShadow(
color: Color.fromARGB(83, 62, 254, 190),
blurRadius: 180,
spreadRadius: 60,
),
],
),
),
),
/// 4⃣ CONTENT LAYER
child,
],
);
}
}

138
lib/widgets/auth_form.dart Normal file
View File

@@ -0,0 +1,138 @@
import 'package:flutter/material.dart';
class AuthForm extends StatefulWidget {
const AuthForm({super.key, required this.onSubmit});
final VoidCallback 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,
),
],
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,
),
),
),
),
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,
),
onPressed: () {
setState(() => _obscure = !_obscure);
},
),
),
),
),
const SizedBox(height: 26),
],
),
),
);
}
}

View File

@@ -0,0 +1,31 @@
import 'package:flutter/material.dart';
class OnboardingButton extends StatelessWidget {
final String text;
final VoidCallback? onPressed;
const OnboardingButton({super.key, required this.text, this.onPressed});
@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,
),
child: Text(
text,
style: const TextStyle(
fontFamily: 'AbdElRady',
color: Colors.white,
fontSize: 20,
fontWeight: FontWeight.w700,
),
),
);
}
}

View File

@@ -0,0 +1,40 @@
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
class OnboardingPage extends StatelessWidget {
final String imagePath;
final String text;
const OnboardingPage({
super.key,
required this.imagePath,
required this.text,
});
@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
SvgPicture.asset(imagePath, height: 280),
const SizedBox(height: 25),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 30),
child: Text(
text,
textAlign: TextAlign.center,
style: const TextStyle(
fontFamily: 'AbdElRady',
fontWeight: FontWeight.w500,
color: Colors.white,
fontSize: 20,
height: 1.5,
),
),
),
],
);
}
}