aefril/enaklo-flutter
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: aefril:472e9f5f69819b7e2451109301d92c7823be8f6d
Branches Tags
aefril:main
aefril:dev
..
compare: aefril:13d07caa74685359331b9b8baee10b48ff5a116a
Branches Tags
aefril:main
aefril:dev

No commits in common. "472e9f5f69819b7e2451109301d92c7823be8f6d" and "13d07caa74685359331b9b8baee10b48ff5a116a" have entirely different histories.
472e9f5f69 ... 13d07caa74

26 changed files with 20 additions and 1201 deletions
Show Stats Expand all files Collapse all files

2
android/app/build.gradle.kts
View File

@ -8,7 +8,7 @@ plugins {
android {
namespace = "com.appskel.enaklo"
compileSdk = flutter.compileSdkVersion
ndkVersion = "27.0.12077973"
ndkVersion = flutter.ndkVersion
compileOptions {
sourceCompatibility = JavaVersion.VERSION_11

BIN
assets/images/onboarding1.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 224 KiB

BIN
assets/images/onboarding2.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 1.3 MiB

BIN
assets/images/onboarding3.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 722 KiB

2
lib/common/theme/app_color.dart
View File

@ -2,7 +2,7 @@ part of 'theme.dart';
class AppColor {
// Primary Colors (Merah)
static const Color primary = Color.fromARGB(255, 196, 2, 2); // #d90000
static const Color primary = Color(0xFFD90000); // #d90000
static const Color primaryLight = Color(0xFFFF4D4D); // merah terang
static const Color primaryDark = Color(0xFF990000); // merah gelap

50
lib/common/theme/theme.dart
View File

@ -1,57 +1,11 @@
import 'package:flutter/material.dart';
import '../../presentation/components/assets/fonts.gen.dart';
part 'app_color.dart';
part 'app_style.dart';
part 'app_value.dart';
UnderlineInputBorder _inputBorder = UnderlineInputBorder(
borderSide: BorderSide(color: AppColor.borderDark, width: 1),
);
class ThemeApp {
static ThemeData get theme => ThemeData(
useMaterial3: true,
fontFamily: FontFamily.quicksand,
primaryColor: AppColor.primary,
scaffoldBackgroundColor: AppColor.white,
appBarTheme: AppBarTheme(
backgroundColor: AppColor.white,
foregroundColor: AppColor.textPrimary,
elevation: 0,
titleTextStyle: AppStyle.xl.copyWith(
color: AppColor.primary,
fontWeight: FontWeight.w600,
),
centerTitle: true,
iconTheme: IconThemeData(color: AppColor.primary),
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: AppColor.primary,
foregroundColor: Colors.white,
elevation: 0,
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(24)),
),
),
inputDecorationTheme: InputDecorationTheme(
border: _inputBorder,
focusedBorder: _inputBorder.copyWith(
borderSide: BorderSide(color: AppColor.primary, width: 2),
),
enabledBorder: _inputBorder,
disabledBorder: _inputBorder.copyWith(
borderSide: BorderSide(color: AppColor.border),
),
errorBorder: _inputBorder.copyWith(
borderSide: BorderSide(color: AppColor.error),
),
hintStyle: AppStyle.md.copyWith(
color: AppColor.textLight,
fontWeight: FontWeight.w500,
),
contentPadding: const EdgeInsets.symmetric(vertical: 12),
),
);
useMaterial3: true,
);
}

5
lib/main.dart
View File

@ -11,9 +11,8 @@ void main() async {
SystemChrome.setSystemUIOverlayStyle(
const SystemUiOverlayStyle(
statusBarColor: Colors.white, // background putih
statusBarIconBrightness: Brightness.dark, // ikon/tulisan hitam
statusBarBrightness: Brightness.light, // khusus iOS biar teksnya gelap
statusBarColor: Colors.transparent,
statusBarIconBrightness: Brightness.dark,
),
);

20
lib/presentation/components/assets/assets.gen.dart
View File

@ -21,26 +21,8 @@ class $AssetsImagesGen {
/// File path: assets/images/logo.png
AssetGenImage get logo => const AssetGenImage('assets/images/logo.png');
/// File path: assets/images/onboarding1.png
AssetGenImage get onboarding1 =>
const AssetGenImage('assets/images/onboarding1.png');
/// File path: assets/images/onboarding2.png
AssetGenImage get onboarding2 =>
const AssetGenImage('assets/images/onboarding2.png');
/// File path: assets/images/onboarding3.png
AssetGenImage get onboarding3 =>
const AssetGenImage('assets/images/onboarding3.png');
/// List of all assets
List<AssetGenImage> get values => [
launcher,
logo,
onboarding1,
onboarding2,
onboarding3,
];
List<AssetGenImage> get values => [launcher, logo];
}
class Assets {

5
lib/presentation/components/button/button.dart
View File

@ -1,5 +0,0 @@
import 'package:flutter/material.dart';
import '../../../common/theme/theme.dart';
part 'elevated_button.dart';

34
lib/presentation/components/button/elevated_button.dart
View File

@ -1,34 +0,0 @@
part of 'button.dart';
class AppElevatedButton extends StatelessWidget {
const AppElevatedButton({
super.key,
required this.onPressed,
required this.title,
this.width = double.infinity,
this.height = 48.0,
});
final Function()? onPressed;
final String title;
final double width;
final double height;
@override
Widget build(BuildContext context) {
return SizedBox(
width: width,
height: height,
child: ElevatedButton(
onPressed: onPressed,
child: Text(
title,
style: AppStyle.lg.copyWith(
color: AppColor.white,
fontWeight: FontWeight.w700,
),
),
),
);
}
}

5
lib/presentation/components/field/field.dart
View File

@ -1,5 +0,0 @@
import 'package:flutter/material.dart';
import '../../../common/theme/theme.dart';
part 'text_form_field.dart';

59
lib/presentation/components/field/text_form_field.dart
View File

@ -1,59 +0,0 @@
part of 'field.dart';
class AppTextFormField extends StatelessWidget {
const AppTextFormField({
super.key,
this.hintText,
required this.title,
this.controller,
this.focusNode,
this.prefixIcon,
this.suffixIcon,
this.keyboardType,
this.onChanged,
});
final String? hintText;
final String title;
final TextEditingController? controller;
final FocusNode? focusNode;
final Widget? prefixIcon;
final Widget? suffixIcon;
final TextInputType? keyboardType;
final ValueChanged<String>? onChanged;
@override
Widget build(BuildContext context) {
return Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(title, style: AppStyle.lg.copyWith(fontWeight: FontWeight.w600)),
const SizedBox(height: 8),
TextFormField(
controller: controller,
focusNode: focusNode,
keyboardType: keyboardType,
onChanged: onChanged,
cursorColor: AppColor.primary,
style: AppStyle.md.copyWith(
color: AppColor.textPrimary,
fontWeight: FontWeight.w500,
),
decoration: InputDecoration(
hintText: hintText,
prefixIcon: prefixIcon,
suffixIcon: suffixIcon,
prefixIconConstraints: const BoxConstraints(
minWidth: 0,
minHeight: 0,
),
suffixIconConstraints: const BoxConstraints(
minWidth: 0,
minHeight: 0,
),
),
),
],
);
}
}

6
lib/presentation/components/image/image.dart
View File

@ -1,6 +0,0 @@
import 'package:flutter/material.dart';
import '../../../common/theme/theme.dart';
import '../assets/assets.gen.dart';
part 'image_placeholder.dart';

83
lib/presentation/components/image/image_placeholder.dart
View File

@ -1,83 +0,0 @@
part of 'image.dart';
class ImagePlaceholder extends StatelessWidget {
const ImagePlaceholder({super.key});
@override
Widget build(BuildContext context) {
return Container(
width: double.infinity,
decoration: const BoxDecoration(
color: Color(0x4DD9D9D9), // Light gray with opacity
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(20),
bottomRight: Radius.circular(20),
),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Hand holding coffee illustration
Container(
width: 120,
height: 160,
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(60),
),
child: Stack(
children: [
// Hand
Positioned(
bottom: 20,
left: 30,
child: Container(
width: 60,
height: 80,
decoration: BoxDecoration(
color: const Color(0xFFFFDBB3),
borderRadius: BorderRadius.circular(30),
),
),
),
// Coffee cup
Positioned(
top: 30,
left: 25,
child: Container(
width: 70,
height: 90,
decoration: BoxDecoration(
color: const Color(0xFFF4E4BC),
borderRadius: BorderRadius.circular(10),
),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Fore logo
Assets.images.logo.image(
width: 40,
height: 40,
fit: BoxFit.contain,
),
const SizedBox(height: 8),
Text(
'Enaklo',
style: TextStyle(
color: AppColor.primary,
fontSize: 12,
fontWeight: FontWeight.bold,
),
),
],
),
),
),
],
),
),
],
),
);
}
}

78
lib/presentation/pages/auth/login/login_page.dart
View File

@ -1,78 +0,0 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/button/button.dart';
import '../../../router/app_router.gr.dart';
import 'widgets/phone_field.dart';
@RoutePage()
class LoginPage extends StatelessWidget {
const LoginPage({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Masuk')),
body: Padding(
padding: const EdgeInsets.symmetric(horizontal: 24.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(height: 40),
// Title
LoginPhoneField(),
const SizedBox(height: 50),
// Continue Button
AppElevatedButton(
onPressed: () {
context.router.push(RegisterRoute());
},
title: 'Lanjutkan',
),
const SizedBox(height: 24),
// Terms and Conditions
Center(
child: RichText(
textAlign: TextAlign.center,
text: TextSpan(
style: AppStyle.md.copyWith(
color: AppColor.textSecondary,
height: 1.4,
),
children: [
const TextSpan(
text: 'Dengan masuk Enaklo, kamu telah\nmenyetujui ',
),
TextSpan(
text: 'Syarat & Ketentuan',
style: AppStyle.md.copyWith(
color: AppColor.primary,
fontWeight: FontWeight.w600,
),
),
const TextSpan(text: ' dan\n'),
TextSpan(
text: 'Kebijakan Privasi',
style: AppStyle.md.copyWith(
color: AppColor.primary,
fontWeight: FontWeight.w600,
),
),
],
),
),
),
const SizedBox(height: 40),
],
),
),
);
}
}

71
lib/presentation/pages/auth/login/widgets/phone_field.dart
View File

@ -1,71 +0,0 @@
import 'package:flutter/material.dart';
import '../../../../../common/theme/theme.dart';
import '../../../../components/field/field.dart';
class LoginPhoneField extends StatefulWidget {
const LoginPhoneField({super.key});
@override
State<LoginPhoneField> createState() => _LoginPhoneFieldState();
}
class _LoginPhoneFieldState extends State<LoginPhoneField> {
final TextEditingController _controller = TextEditingController();
final FocusNode _focusNode = FocusNode();
bool _hasFocus = false;
@override
void initState() {
super.initState();
_focusNode.addListener(() {
setState(() {
_hasFocus = _focusNode.hasFocus;
});
});
}
@override
void dispose() {
_controller.dispose();
_focusNode.dispose();
super.dispose();
}
void _clearText() {
_controller.clear();
setState(() {});
}
@override
Widget build(BuildContext context) {
return AppTextFormField(
title: 'Masukkan no telepon',
hintText: '8712671212',
controller: _controller,
focusNode: _focusNode,
keyboardType: TextInputType.phone,
prefixIcon: Padding(
padding: const EdgeInsets.symmetric(horizontal: 12),
child: Text(
'+62',
style: AppStyle.md.copyWith(
color: AppColor.textPrimary,
fontWeight: FontWeight.w500,
),
),
),
suffixIcon: (_hasFocus && _controller.text.isNotEmpty)
? IconButton(
onPressed: _clearText,
icon: Icon(Icons.close, color: AppColor.primary, size: 20),
constraints: const BoxConstraints(),
padding: const EdgeInsets.all(8),
)
: null,
onChanged: (value) {
setState(() {});
},
);
}
}

252
lib/presentation/pages/auth/otp/otp_page.dart
View File

@ -1,252 +0,0 @@
import 'dart:async';
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import '../../../../common/theme/theme.dart';
import '../../../components/button/button.dart';
@RoutePage()
class OtpPage extends StatefulWidget {
const OtpPage({super.key});
@override
State<OtpPage> createState() => _OtpPageState();
}
class _OtpPageState extends State<OtpPage> {
final List<TextEditingController> _controllers = List.generate(
6,
(index) => TextEditingController(),
);
final List<FocusNode> _focusNodes = List.generate(6, (index) => FocusNode());
Timer? _timer;
int _secondsRemaining = 18;
bool _canResend = false;
@override
void initState() {
super.initState();
_startTimer();
}
void _startTimer() {
_timer = Timer.periodic(const Duration(seconds: 1), (timer) {
if (_secondsRemaining > 0) {
setState(() {
_secondsRemaining--;
});
} else {
setState(() {
_canResend = true;
});
_timer?.cancel();
}
});
}
void _resendCode() {
setState(() {
_secondsRemaining = 18;
_canResend = false;
});
_startTimer();
// Add your resend logic here
}
String _formatTime(int seconds) {
int minutes = seconds ~/ 60;
int remainingSeconds = seconds % 60;
return '${minutes.toString().padLeft(2, '0')}:${remainingSeconds.toString().padLeft(2, '0')}';
}
void _onCodeChanged(String value, int index) {
if (value.isNotEmpty) {
// Move to next field
if (index < 5) {
_focusNodes[index + 1].requestFocus();
} else {
// Last field, unfocus
_focusNodes[index].unfocus();
_verifyCode();
}
} else {
// Handle backspace - move to previous field
if (index > 0) {
_focusNodes[index - 1].requestFocus();
}
}
}
void _verifyCode() {
String code = _controllers.map((controller) => controller.text).join();
if (code.length == 6) {
// Add your verification logic here
print('Verifying code: $code');
}
}
@override
void dispose() {
_timer?.cancel();
for (var controller in _controllers) {
controller.dispose();
}
for (var focusNode in _focusNodes) {
focusNode.dispose();
}
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text('Verifikasi')),
body: Padding(
padding: const EdgeInsets.symmetric(horizontal: 20.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(height: 20),
// Title
Text(
'Masukan Kode Verifikasi',
style: AppStyle.xl.copyWith(
fontWeight: FontWeight.w600,
color: AppColor.textPrimary,
),
),
const SizedBox(height: 12),
// Description
RichText(
text: TextSpan(
children: [
TextSpan(
text: 'Kami telah mengirimkan kode verifikasi melalui ',
style: AppStyle.sm.copyWith(
color: AppColor.textSecondary,
height: 1.4,
),
),
TextSpan(
text: 'Whatsapp',
style: AppStyle.sm.copyWith(
color: AppColor.success,
fontWeight: FontWeight.w500,
height: 1.4,
),
),
TextSpan(
text: ' ke ',
style: AppStyle.sm.copyWith(
color: AppColor.textSecondary,
height: 1.4,
),
),
TextSpan(
text: '+6288976680234',
style: AppStyle.sm.copyWith(
color: AppColor.textPrimary,
fontWeight: FontWeight.w500,
height: 1.4,
),
),
],
),
),
const SizedBox(height: 6),
// Hidden text fields for input
Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: List.generate(6, (index) {
return Expanded(
child: Padding(
padding: EdgeInsets.only(right: index == 5 ? 0 : 8.0),
child: TextFormField(
controller: _controllers[index],
focusNode: _focusNodes[index],
keyboardType: TextInputType.number,
maxLength: 1,
inputFormatters: [FilteringTextInputFormatter.digitsOnly],
decoration: InputDecoration(counterText: ''),
textAlign: TextAlign.center,
style: AppStyle.lg.copyWith(
color: AppColor.primary,
fontWeight: FontWeight.w600,
),
cursorColor: AppColor.primary,
onChanged: (value) {
setState(() {});
_onCodeChanged(value, index);
},
),
),
);
}),
),
const SizedBox(height: 40),
// Timer and Resend Section
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Text(
'Mohon tunggu untuk kirim ulang kode ',
style: AppStyle.xs.copyWith(color: AppColor.textSecondary),
),
Text(
_formatTime(_secondsRemaining),
style: AppStyle.xs.copyWith(
color: AppColor.textSecondary,
fontWeight: FontWeight.w500,
),
),
],
),
if (_canResend) ...[
const SizedBox(height: 12),
Center(
child: TextButton(
onPressed: _resendCode,
child: Text(
'Kirim Ulang Kode',
style: AppStyle.sm.copyWith(
color: AppColor.success,
fontWeight: FontWeight.w500,
),
),
),
),
],
const Spacer(),
// Continue Button
AppElevatedButton(
title: 'Verifikasi',
onPressed: () {
String code = _controllers
.map((controller) => controller.text)
.join();
if (code.length == 6) {
_verifyCode();
}
},
),
const SizedBox(height: 24),
],
),
),
);
}
}

45
lib/presentation/pages/auth/register/register_page.dart
View File

@ -1,45 +0,0 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import '../../../components/button/button.dart';
import '../../../router/app_router.gr.dart';
import 'widgets/name_field.dart';
import 'widgets/phone_field.dart';
@RoutePage()
class RegisterPage extends StatelessWidget {
const RegisterPage({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Masuk')),
body: Padding(
padding: const EdgeInsets.symmetric(horizontal: 24.0),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(height: 40),
// Title
RegisterPhoneField(),
SizedBox(height: 24),
RegisterNameField(),
const SizedBox(height: 50),
Spacer(),
// Continue Button
AppElevatedButton(
onPressed: () => context.router.push(const OtpRoute()),
title: 'Daftar & Lanjutkan',
),
const SizedBox(height: 24),
],
),
),
);
}
}

12
lib/presentation/pages/auth/register/widgets/name_field.dart
View File

@ -1,12 +0,0 @@
import 'package:flutter/material.dart';
import '../../../../components/field/field.dart';
class RegisterNameField extends StatelessWidget {
const RegisterNameField({super.key});
@override
Widget build(BuildContext context) {
return AppTextFormField(title: 'Masukkan nama', hintText: 'John Doe');
}
}

71
lib/presentation/pages/auth/register/widgets/phone_field.dart
View File

@ -1,71 +0,0 @@
import 'package:flutter/material.dart';
import '../../../../../common/theme/theme.dart';
import '../../../../components/field/field.dart';
class RegisterPhoneField extends StatefulWidget {
const RegisterPhoneField({super.key});
@override
State<RegisterPhoneField> createState() => _RegisterPhoneFieldState();
}
class _RegisterPhoneFieldState extends State<RegisterPhoneField> {
final TextEditingController _controller = TextEditingController();
final FocusNode _focusNode = FocusNode();
bool _hasFocus = false;
@override
void initState() {
super.initState();
_focusNode.addListener(() {
setState(() {
_hasFocus = _focusNode.hasFocus;
});
});
}
@override
void dispose() {
_controller.dispose();
_focusNode.dispose();
super.dispose();
}
void _clearText() {
_controller.clear();
setState(() {});
}
@override
Widget build(BuildContext context) {
return AppTextFormField(
title: 'Masukkan no telepon',
hintText: '8712671212',
controller: _controller,
focusNode: _focusNode,
keyboardType: TextInputType.phone,
prefixIcon: Padding(
padding: const EdgeInsets.symmetric(horizontal: 12),
child: Text(
'+62',
style: AppStyle.md.copyWith(
color: AppColor.textPrimary,
fontWeight: FontWeight.w500,
),
),
),
suffixIcon: (_hasFocus && _controller.text.isNotEmpty)
? IconButton(
onPressed: _clearText,
icon: Icon(Icons.close, color: AppColor.primary, size: 20),
constraints: const BoxConstraints(),
padding: const EdgeInsets.all(8),
)
: null,
onChanged: (value) {
setState(() {});
},
);
}
}

208
lib/presentation/pages/onboarding/onboarding_page.dart
View File

@ -1,208 +0,0 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:carousel_slider/carousel_slider.dart';
import '../../../common/theme/theme.dart';
import '../../components/assets/assets.gen.dart';
import '../../components/button/button.dart';
import '../../components/image/image.dart';
import '../../router/app_router.gr.dart';
@RoutePage()
class OnboardingPage extends StatefulWidget {
const OnboardingPage({super.key});
@override
State<OnboardingPage> createState() => _OnboardingPageState();
}
class _OnboardingPageState extends State<OnboardingPage> {
int currentIndex = 0;
final CarouselSliderController _carouselController =
CarouselSliderController();
final List<OnboardingData> onboardingData = [
OnboardingData(
image: Assets.images.onboarding1.path,
title: 'Nikmati Hidangan Kapanpun, Dimanapun',
subtitle:
'Bebas pilih cara penyajian, bisa dine-in di restoran atau pesan antar langsung ke lokasimu',
),
OnboardingData(
image: Assets.images.onboarding2.path,
title: 'Bahan Berkualitas Premium',
subtitle:
'Kami hanya menggunakan bahan segar pilihan untuk menghadirkan cita rasa terbaik di setiap hidangan',
),
OnboardingData(
image: Assets.images.onboarding3.path,
title: 'Pesan dengan Praktis',
subtitle:
'Aplikasi dengan tampilan sederhana memudahkanmu memesan makanan favorit kapan saja',
),
];
@override
Widget build(BuildContext context) {
final screenHeight = MediaQuery.of(context).size.height;
final imageHeight = screenHeight * 0.6; // 60% dari tinggi layar
return Scaffold(
backgroundColor: Colors.white, // Changed to white background
body: Column(
children: [
// Image carousel - 60% of screen height
SizedBox(height: imageHeight, child: _buildImageCarousel()),
// Bottom content - remaining space
Expanded(child: _buildBottomContent()),
],
),
);
}
Widget _buildImageCarousel() {
return Stack(
children: [
// Carousel
CarouselSlider.builder(
carouselController: _carouselController,
itemCount: onboardingData.length,
itemBuilder: (context, index, realIndex) {
return SizedBox(
width: double.infinity, // Full width
child: ClipRRect(
child: Image.asset(
onboardingData[index].image,
fit: BoxFit.fill,
width: double.infinity,
errorBuilder: (context, error, stackTrace) {
return ImagePlaceholder();
},
),
),
);
},
options: CarouselOptions(
height: double.infinity,
viewportFraction: 1.0,
enableInfiniteScroll: true,
autoPlay: true,
onPageChanged: (index, reason) {
setState(() {
currentIndex = index;
});
},
),
),
// White overlay gradient at bottom
Positioned(
bottom: 0,
left: 0,
right: 0,
child: Container(
height: 100,
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [
Colors.white.withOpacity(0.1),
Color(0x80FFFFFF), // White with 50% opacity
Colors.white, // Pure white
],
),
),
),
),
// Dots indicator positioned over the white overlay
Positioned(
bottom: 30,
left: 0,
right: 0,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: List.generate(
onboardingData.length,
(index) => Container(
margin: const EdgeInsets.symmetric(horizontal: 4),
height: 8,
width: currentIndex == index ? 24 : 8,
decoration: BoxDecoration(
color: currentIndex == index
? AppColor.primary
: AppColor.borderLight,
borderRadius: BorderRadius.circular(4),
),
),
),
),
),
],
);
}
Widget _buildBottomContent() {
return Padding(
padding: const EdgeInsets.all(24),
child: Column(
children: [
const SizedBox(height: 16),
// Title
Text(
onboardingData[currentIndex].title,
textAlign: TextAlign.center,
style: AppStyle.xl.copyWith(fontWeight: FontWeight.w800),
),
const SizedBox(height: 12),
// Subtitle
Text(
onboardingData[currentIndex].subtitle,
textAlign: TextAlign.center,
style: AppStyle.md.copyWith(
fontWeight: FontWeight.w500,
color: AppColor.textSecondary,
),
),
const Spacer(),
AppElevatedButton(
onPressed: () => context.router.push(const LoginRoute()),
title: 'Masuk',
),
const SizedBox(height: 12),
TextButton(
onPressed: () {},
child: Text(
'Lewati tahap ini',
style: AppStyle.md.copyWith(
color: AppColor.textSecondary,
fontWeight: FontWeight.w600,
),
),
),
],
),
);
}
}
class OnboardingData {
final String image;
final String title;
final String subtitle;
OnboardingData({
required this.image,
required this.title,
required this.subtitle,
});
}

106
lib/presentation/pages/splash/splash_page.dart
View File

@ -1,10 +1,5 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'dart:async';
import '../../../common/theme/theme.dart';
import '../../components/assets/assets.gen.dart';
import '../../router/app_router.gr.dart';
@RoutePage()
class SplashPage extends StatefulWidget {
@ -14,107 +9,12 @@ class SplashPage extends StatefulWidget {
State<SplashPage> createState() => _SplashPageState();
}
class _SplashPageState extends State<SplashPage>
with SingleTickerProviderStateMixin {
late AnimationController _logoController;
late Animation<double> _logoScaleAnimation;
late Animation<double> _logoOpacityAnimation;
@override
void initState() {
super.initState();
_initAnimations();
_startAnimations();
_navigateToHome();
}
void _initAnimations() {
// Logo Animation Controller
_logoController = AnimationController(
duration: const Duration(milliseconds: 1500),
vsync: this,
);
// Logo Animations
_logoScaleAnimation = Tween<double>(begin: 0.0, end: 1.0).animate(
CurvedAnimation(parent: _logoController, curve: Curves.elasticOut),
);
_logoOpacityAnimation = Tween<double>(
begin: 0.0,
end: 1.0,
).animate(CurvedAnimation(parent: _logoController, curve: Curves.easeIn));
}
void _startAnimations() {
// Start logo animation
_logoController.forward();
}
void _navigateToHome() {
Timer(const Duration(milliseconds: 2500), () {
context.router.push(OnboardingRoute());
});
}
@override
void dispose() {
_logoController.dispose();
super.dispose();
}
class _SplashPageState extends State<SplashPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
width: double.infinity,
height: double.infinity,
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [AppColor.backgroundLight, AppColor.background],
),
),
child: Center(
child: AnimatedBuilder(
animation: _logoController,
builder: (context, child) {
return Transform.scale(
scale: _logoScaleAnimation.value,
child: Opacity(
opacity: _logoOpacityAnimation.value,
child: Container(
width: 140,
height: 140,
decoration: BoxDecoration(
gradient: const LinearGradient(
colors: AppColor.primaryGradient,
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color: AppColor.primaryWithOpacity(0.4),
blurRadius: 25,
offset: const Offset(0, 12),
),
],
),
child: ClipOval(
child: Padding(
padding: const EdgeInsets.all(20),
child: Assets.images.logo.image(fit: BoxFit.contain),
),
),
),
),
);
},
),
),
body: Center(
child: Text("Splash Page"),
),
);
}

14
lib/presentation/router/app_router.dart
View File

@ -5,15 +5,7 @@ import 'app_router.gr.dart';
class AppRouter extends RootStackRouter {
@override
List<AutoRoute> get routes => [
// Splash
AutoRoute(page: SplashRoute.page, initial: true),
// Onboarding
AutoRoute(page: OnboardingRoute.page),
// Auth
AutoRoute(page: LoginRoute.page),
AutoRoute(page: RegisterRoute.page),
AutoRoute(page: OtpRoute.page),
];
// Splash
AutoRoute(page: SplashRoute.page, initial: true),
];
}

84
lib/presentation/router/app_router.gr.dart
View File

@ -9,91 +9,21 @@
// coverage:ignore-file
// ignore_for_file: no_leading_underscores_for_library_prefixes
import 'package:auto_route/auto_route.dart' as _i6;
import 'package:enaklo/presentation/pages/auth/login/login_page.dart' as _i1;
import 'package:enaklo/presentation/pages/auth/otp/otp_page.dart' as _i3;
import 'package:enaklo/presentation/pages/auth/register/register_page.dart'
as _i4;
import 'package:enaklo/presentation/pages/onboarding/onboarding_page.dart'
as _i2;
import 'package:enaklo/presentation/pages/splash/splash_page.dart' as _i5;
import 'package:auto_route/auto_route.dart' as _i2;
import 'package:enaklo/presentation/pages/splash/splash_page.dart' as _i1;
/// generated route for
/// [_i1.LoginPage]
class LoginRoute extends _i6.PageRouteInfo<void> {
const LoginRoute({List<_i6.PageRouteInfo>? children})
: super(LoginRoute.name, initialChildren: children);
static const String name = 'LoginRoute';
static _i6.PageInfo page = _i6.PageInfo(
name,
builder: (data) {
return const _i1.LoginPage();
},
);
}
/// generated route for
/// [_i2.OnboardingPage]
class OnboardingRoute extends _i6.PageRouteInfo<void> {
const OnboardingRoute({List<_i6.PageRouteInfo>? children})
: super(OnboardingRoute.name, initialChildren: children);
static const String name = 'OnboardingRoute';
static _i6.PageInfo page = _i6.PageInfo(
name,
builder: (data) {
return const _i2.OnboardingPage();
},
);
}
/// generated route for
/// [_i3.OtpPage]
class OtpRoute extends _i6.PageRouteInfo<void> {
const OtpRoute({List<_i6.PageRouteInfo>? children})
: super(OtpRoute.name, initialChildren: children);
static const String name = 'OtpRoute';
static _i6.PageInfo page = _i6.PageInfo(
name,
builder: (data) {
return const _i3.OtpPage();
},
);
}
/// generated route for
/// [_i4.RegisterPage]
class RegisterRoute extends _i6.PageRouteInfo<void> {
const RegisterRoute({List<_i6.PageRouteInfo>? children})
: super(RegisterRoute.name, initialChildren: children);
static const String name = 'RegisterRoute';
static _i6.PageInfo page = _i6.PageInfo(
name,
builder: (data) {
return const _i4.RegisterPage();
},
);
}
/// generated route for
/// [_i5.SplashPage]
class SplashRoute extends _i6.PageRouteInfo<void> {
const SplashRoute({List<_i6.PageRouteInfo>? children})
/// [_i1.SplashPage]
class SplashRoute extends _i2.PageRouteInfo<void> {
const SplashRoute({List<_i2.PageRouteInfo>? children})
: super(SplashRoute.name, initialChildren: children);
static const String name = 'SplashRoute';
static _i6.PageInfo page = _i6.PageInfo(
static _i2.PageInfo page = _i2.PageInfo(
name,
builder: (data) {
return const _i5.SplashPage();
return const _i1.SplashPage();
},
);
}

8
pubspec.lock
View File

@ -137,14 +137,6 @@ packages:
url: "https://pub.dev"
source: hosted
version: "8.11.1"
carousel_slider:
dependency: "direct main"
description:
name: carousel_slider
sha256: bcc61735345c9ab5cb81073896579e735f81e35fd588907a393143ea986be8ff
url: "https://pub.dev"
source: hosted
version: "5.1.1"
characters:
dependency: transitive
description:

1
pubspec.yaml
View File

@ -27,7 +27,6 @@ dependencies:
freezed_annotation: ^2.4.1
json_annotation: ^4.9.0
shared_preferences: ^2.5.3
carousel_slider: ^5.1.1
dev_dependencies:
flutter_test: