fisrt three screens
This commit is contained in:
Daniah Ayad Al-sultani
26
lib/screens/auth_screen.dart
Normal file
26
lib/screens/auth_screen.dart
Normal 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,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
154
lib/screens/onboarding_screen.dart
Normal file
154
lib/screens/onboarding_screen.dart
Normal 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),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
40
lib/screens/splash_screen.dart
Normal file
40
lib/screens/splash_screen.dart
Normal 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)),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user