From edd2187c077aeb887e247f86e889312846035104 Mon Sep 17 00:00:00 2001 From: orangdeso Date: Sat, 24 May 2025 22:55:26 +0700 Subject: [PATCH] Feat: done slicing banner --- .../controllers/transaction_controller.dart | 4 +- .../screens/home/component/banner.dart | 0 .../component/banners/features_banner.dart | 116 ++++++++++++++++++ .../component/banners/priority_banner.dart | 95 ++++++++++++++ .../component/banners/service_banner.dart | 89 ++++++++++++++ .../component/banners/welcome_banner.dart | 91 ++++++++++++++ .../home/pages/booking_tickets_screen.dart | 1 - .../screens/home/pages/home_screen.dart | 22 ++-- .../pages/information_users_screen.dart | 16 +-- 9 files changed, 410 insertions(+), 24 deletions(-) delete mode 100644 lib/presentation/screens/home/component/banner.dart create mode 100644 lib/presentation/screens/home/component/banners/features_banner.dart create mode 100644 lib/presentation/screens/home/component/banners/priority_banner.dart create mode 100644 lib/presentation/screens/home/component/banners/service_banner.dart create mode 100644 lib/presentation/screens/home/component/banners/welcome_banner.dart diff --git a/lib/presentation/controllers/transaction_controller.dart b/lib/presentation/controllers/transaction_controller.dart index 8258a38..98e2793 100644 --- a/lib/presentation/controllers/transaction_controller.dart +++ b/lib/presentation/controllers/transaction_controller.dart @@ -28,8 +28,8 @@ class TransactionController extends GetxController { Map? porterServiceDetails, required Map userDetails, required int passenger, - required List> passengerDetails, // Tambah parameter ini - required List numberSeat, // Tambah parameter ini + required List> passengerDetails, + required List numberSeat, }) async { try { isLoading.value = true; diff --git a/lib/presentation/screens/home/component/banner.dart b/lib/presentation/screens/home/component/banner.dart deleted file mode 100644 index e69de29..0000000 diff --git a/lib/presentation/screens/home/component/banners/features_banner.dart b/lib/presentation/screens/home/component/banners/features_banner.dart new file mode 100644 index 0000000..fd01c14 --- /dev/null +++ b/lib/presentation/screens/home/component/banners/features_banner.dart @@ -0,0 +1,116 @@ +import 'package:e_porter/_core/constants/typography.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; + +class FeaturesBanner extends StatelessWidget { + const FeaturesBanner({super.key}); + + @override + Widget build(BuildContext context) { + return Container( + width: double.infinity, + height: 170.h, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(16.r), + gradient: LinearGradient( + begin: Alignment.topLeft, + end: Alignment.bottomRight, + colors: [ + Color(0xFF059669), // Emerald 600 + Color(0xFF10B981), // Emerald 500 + ], + ), + ), + child: Stack( + children: [ + Positioned( + right: 20.w, + top: -10.h, + child: Container( + width: 40.w, + height: 40.h, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: Colors.white.withOpacity(0.15), + ), + ), + ), + Padding( + padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.h), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Row( + children: [ + Container( + padding: EdgeInsets.symmetric(horizontal: 6.w, vertical: 6.h), + decoration: BoxDecoration( + color: Colors.white.withOpacity(0.2), + borderRadius: BorderRadius.circular(8.r), + ), + child: Icon( + Icons.star_rounded, + color: Colors.white, + size: 20.w, + ), + ), + SizedBox(width: 12.w), + TypographyStyles.body( + 'Fitur Unggulan', + color: Colors.white, + ), + ], + ), + SizedBox(height: 10.h), + Row( + children: [ + _buildFeatureItem('Fast Track', Icons.directions_run), + SizedBox(width: 16.w), + _buildFeatureItem('Porter VIP', Icons.verified_user), + SizedBox(width: 16.w), + _buildFeatureItem('Transit', Icons.sync_alt), + ], + ), + SizedBox(height: 10.h), + TypographyStyles.tiny( + 'Nikmati layanan premium untuk perjalanan Anda', + color: Colors.white, + fontWeight: FontWeight.w500, + ), + ], + ), + ), + ], + ), + ); + } + + Widget _buildFeatureItem(String text, IconData icon) { + return Expanded( + child: Container( + padding: EdgeInsets.symmetric(vertical: 8.h, horizontal: 8.w), + decoration: BoxDecoration( + color: Colors.white.withOpacity(0.15), + borderRadius: BorderRadius.circular(8.r), + ), + child: Column( + children: [ + Icon( + icon, + color: Colors.white, + size: 16.w, + ), + SizedBox(height: 4.h), + TypographyStyles.tiny( + text, + color: Colors.white, + fontWeight: FontWeight.w500, + textAlign: TextAlign.center, + ), + ], + ), + ), + ); + } +} diff --git a/lib/presentation/screens/home/component/banners/priority_banner.dart b/lib/presentation/screens/home/component/banners/priority_banner.dart new file mode 100644 index 0000000..bc8b441 --- /dev/null +++ b/lib/presentation/screens/home/component/banners/priority_banner.dart @@ -0,0 +1,95 @@ +import 'package:e_porter/_core/constants/typography.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; + +class PriorityBanner extends StatelessWidget { + const PriorityBanner({super.key}); + + @override + Widget build(BuildContext context) { + return Container( + width: double.infinity, + height: 160.h, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(16.r), + gradient: LinearGradient( + begin: Alignment.topLeft, + end: Alignment.bottomRight, + colors: [ + Color(0xFF7C3AED), + Color(0xFF8B5CF6), + ], + ), + ), + child: Stack( + children: [ + Positioned( + left: 20.w, + top: -20.h, + child: Container( + width: 80.w, + height: 80.h, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: Colors.white.withOpacity(0.1), + ), + ), + ), + Positioned( + right: -10.w, + bottom: -10.h, + child: Container( + width: 60.w, + height: 60.h, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: Colors.white.withOpacity(0.08), + ), + ), + ), + Padding( + padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.h), + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Row( + children: [ + Icon( + Icons.diamond_outlined, + color: Colors.white, + size: 16.w, + ), + SizedBox(width: 8.w), + TypographyStyles.caption( + 'PREMIUM SERVICE', + color: Colors.white, + ), + ], + ), + SizedBox(height: 10.h), + TypographyStyles.h6('Prioritas Anda, \nKepuasan Kami', color: Colors.white), + SizedBox(height: 8.h), + TypographyStyles.tiny( + 'Booking mudah, layanan cepat, perjalanan nyaman', + color: Colors.white, + fontWeight: FontWeight.w400, + ), + // SizedBox(height: 16.h), + // Container( + // padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 8.h), + // decoration: BoxDecoration( + // color: Colors.white.withOpacity(0.2), + // borderRadius: BorderRadius.circular(20.r), + // border: Border.all(color: Colors.white.withOpacity(0.3), width: 1.w), + // ), + // child: TypographyStyles.tiny('Pesan Sekarang', color: Colors.white, fontWeight: FontWeight.w500), + // ), + ], + ), + ), + ], + ), + ); + } +} diff --git a/lib/presentation/screens/home/component/banners/service_banner.dart b/lib/presentation/screens/home/component/banners/service_banner.dart new file mode 100644 index 0000000..99186aa --- /dev/null +++ b/lib/presentation/screens/home/component/banners/service_banner.dart @@ -0,0 +1,89 @@ +import 'package:e_porter/_core/constants/typography.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; + +class ServiceBanner extends StatelessWidget { + const ServiceBanner({super.key}); + + @override + Widget build(BuildContext context) { + return Container( + width: double.infinity, + height: 170.h, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(16.r), + gradient: LinearGradient( + begin: Alignment.topLeft, + end: Alignment.bottomRight, + colors: [ + Color(0xFFEA580C), + Color(0xFFF97316), + ], + ), + ), + child: Stack( + children: [ + Positioned( + right: -40.w, + top: -20.h, + child: Transform.rotate( + angle: 0.3, + child: Container( + width: 100.w, + height: 100.h, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(16.r), + color: Colors.white.withOpacity(0.1), + ), + ), + ), + ), + Padding( + padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.h), + child: Row( + children: [ + Expanded( + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Container( + padding: EdgeInsets.symmetric(horizontal: 12.w, vertical: 6.h), + decoration: BoxDecoration( + color: Colors.white.withOpacity(0.2), + borderRadius: BorderRadius.circular(20.r), + ), + child: TypographyStyles.caption('E-Porter', color: Colors.white), + ), + SizedBox(height: 6.h), + TypographyStyles.h6('Layanan Porter\nProfessional', color: Colors.white), + SizedBox(height: 8.h), + TypographyStyles.tiny( + 'Nikmati kemudahan perjalanan dengan bantuan porter terpercaya', + color: Colors.white, + fontWeight: FontWeight.w400, + ), + ], + ), + ), + Container( + width: 60.w, + height: 60.h, + decoration: BoxDecoration( + color: Colors.white.withOpacity(0.2), + borderRadius: BorderRadius.circular(30.r), + ), + child: Icon( + Icons.support_agent_rounded, + size: 30.w, + color: Colors.white, + ), + ), + ], + ), + ), + ], + ), + ); + } +} diff --git a/lib/presentation/screens/home/component/banners/welcome_banner.dart b/lib/presentation/screens/home/component/banners/welcome_banner.dart new file mode 100644 index 0000000..596b12d --- /dev/null +++ b/lib/presentation/screens/home/component/banners/welcome_banner.dart @@ -0,0 +1,91 @@ +import 'package:e_porter/_core/constants/typography.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_screenutil/flutter_screenutil.dart'; + +class WelcomeBanner extends StatelessWidget { + const WelcomeBanner({super.key}); + + @override + Widget build(BuildContext context) { + return Container( + width: double.infinity, + height: 170.h, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(16.r), + gradient: LinearGradient( + begin: Alignment.topLeft, + end: Alignment.bottomRight, + colors: [ + Color(0xFF1E40AF), + Color(0xFF3B82F6), + ], + ), + ), + child: Stack( + children: [ + Positioned( + right: -20.w, + top: -20.h, + child: Container( + width: 120.w, + height: 120.h, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: Colors.white.withOpacity(0.1), + ), + ), + ), + Positioned( + right: 40.w, + bottom: -30.h, + child: Container( + width: 80.w, + height: 80.h, + decoration: BoxDecoration( + shape: BoxShape.circle, + color: Colors.white.withOpacity(0.08), + ), + ), + ), + Padding( + padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 16.h), + child: Row( + children: [ + Expanded( + flex: 2, + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + mainAxisAlignment: MainAxisAlignment.center, + children: [ + TypographyStyles.h6('Selamat Datang!', color: Colors.white), + SizedBox(height: 8.h), + TypographyStyles.h5('E-Porter', color: Colors.white), + SizedBox(height: 8.h), + TypographyStyles.caption( + 'Your Porter, Your Priority', + fontWeight: FontWeight.w500, + color: Colors.white, + ), + ], + ), + ), + Container( + padding: EdgeInsets.symmetric(horizontal: 16.w, vertical: 10.h), + decoration: BoxDecoration( + color: Colors.white.withOpacity(0.2), + borderRadius: BorderRadius.circular(10.r), + ), + child: Icon( + Icons.flight_takeoff_rounded, + size: 40.w, + color: Colors.white, + ), + ), + ], + ), + ), + ], + ), + ); + } +} diff --git a/lib/presentation/screens/home/pages/booking_tickets_screen.dart b/lib/presentation/screens/home/pages/booking_tickets_screen.dart index f6e03ed..a1505b7 100644 --- a/lib/presentation/screens/home/pages/booking_tickets_screen.dart +++ b/lib/presentation/screens/home/pages/booking_tickets_screen.dart @@ -1,5 +1,4 @@ import 'dart:developer'; - import 'package:e_porter/_core/component/appbar/appbar_component.dart'; import 'package:e_porter/_core/component/button/button_fill.dart'; import 'package:e_porter/_core/component/card/custome_shadow_cotainner.dart'; diff --git a/lib/presentation/screens/home/pages/home_screen.dart b/lib/presentation/screens/home/pages/home_screen.dart index b134cab..a6e516f 100644 --- a/lib/presentation/screens/home/pages/home_screen.dart +++ b/lib/presentation/screens/home/pages/home_screen.dart @@ -1,5 +1,4 @@ // ignore_for_file: deprecated_member_use - import 'package:e_porter/_core/component/appbar/appbar_component.dart'; import 'package:e_porter/_core/component/button/button_list_tile.dart'; import 'package:e_porter/_core/component/card/custome_shadow_cotainner.dart'; @@ -10,6 +9,10 @@ import 'package:e_porter/_core/constants/typography.dart'; import 'package:e_porter/_core/service/preferences_service.dart'; import 'package:e_porter/presentation/controllers/porter_queue_controller.dart'; import 'package:e_porter/presentation/controllers/statistic_controller.dart'; +import 'package:e_porter/presentation/screens/home/component/banners/features_banner.dart'; +import 'package:e_porter/presentation/screens/home/component/banners/priority_banner.dart'; +import 'package:e_porter/presentation/screens/home/component/banners/service_banner.dart'; +import 'package:e_porter/presentation/screens/home/component/banners/welcome_banner.dart'; import 'package:e_porter/presentation/screens/home/component/card_service_porter.dart'; import 'package:e_porter/presentation/screens/home/component/date_setting.dart'; import 'package:e_porter/presentation/screens/home/component/profile_avatar.dart'; @@ -22,7 +25,6 @@ import 'package:flutter_svg/flutter_svg.dart'; import 'package:get/get.dart'; import 'package:intl/intl.dart'; import 'package:zoom_tap_animation/zoom_tap_animation.dart'; - import '../../../../_core/utils/snackbar/snackbar_helper.dart'; import '../../../../domain/models/user_entity.dart'; @@ -44,16 +46,10 @@ class _HomeScreenState extends State { final _statisticController = Get.find(); final List imageList = [ - Container( - child: Image.asset( - 'assets/images/banner.png', - ), - ), - Container( - child: Image.asset( - 'assets/images/banner.png', - ), - ) + const WelcomeBanner(), + const FeaturesBanner(), + const ServiceBanner(), + const PriorityBanner(), ]; @override @@ -253,7 +249,7 @@ class _HomeScreenState extends State { ], ), ), - SvgPicture.asset('assets/icons/ic_notification.svg'), + // SvgPicture.asset('assets/icons/ic_notification.svg'), ], ), SizedBox(height: 20.h), diff --git a/lib/presentation/screens/profile/pages/information_users_screen.dart b/lib/presentation/screens/profile/pages/information_users_screen.dart index a313bd2..c7dd666 100644 --- a/lib/presentation/screens/profile/pages/information_users_screen.dart +++ b/lib/presentation/screens/profile/pages/information_users_screen.dart @@ -58,14 +58,14 @@ class _InformationUsersScreenState extends State { ), ); }), - bottomNavigationBar: CustomeShadowCotainner( - child: ButtonOutline( - text: 'Hapus Akun', - textColor: RedColors.red600, - borderColor: RedColors.red600, - onTap: () {}, - ), - ), + // bottomNavigationBar: CustomeShadowCotainner( + // child: ButtonOutline( + // text: 'Hapus Akun', + // textColor: RedColors.red600, + // borderColor: RedColors.red600, + // onTap: () {}, + // ), + // ), ); }