155 lines
4.7 KiB
Dart
155 lines
4.7 KiB
Dart
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),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
}
|