CityCards/CityCards_Customer_Flutter
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

worked on onboarding screen

Browse Source
This commit is contained in:
Vinayakkadge04
2025-11-07 17:44:51 +05:30
parent 061f196ece
commit 7d4c015134
20 changed files with 382 additions and 257 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/images/splash1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.6 MiB

BIN
assets/images/splash2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 MiB

BIN
assets/images/splash3.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 366 KiB

1
assets/intro/anim.json Normal file
View File

File diff suppressed because one or more lines are too long

1
assets/intro/animation.json Normal file
View File

File diff suppressed because one or more lines are too long

1
assets/intro/splash.json Normal file
View File

File diff suppressed because one or more lines are too long

109
lib/checkout/widget/all_coupons_bottomsheet.dart
View File

@@ -1,4 +1,4 @@
import 'package:citycards_customer/checkout/widget/purchase_details_bottomsheet.dart';
import 'package:citycards_customer/postcard/widgets/purchase_details_bottom_sheet.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:citycards_customer/common_packages/custom_text.dart';
@@ -6,11 +6,23 @@ import 'package:citycards_customer/common_packages/custom_text.dart';
class AllCouponsBottomsheet extends StatelessWidget {
AllCouponsBottomsheet({super.key});
final List<String> coupons = [
"assets/images/red_coupon.png",
"assets/images/green_coupon.png",
"assets/images/orange_coupon.png",
"assets/images/orange_coupon.png",
final List<Map<String, String>> coupons = [
{
"text": "Flat 3% cashback using Amazon Pay Balance",
"coupon_code": "AMZNPAY3",
},
{
"text": "Flat 3% cashback using Amazon Pay Balance",
"coupon_code": "AMZNPAY3",
},
{
"text": "Flat 3% cashback using Amazon Pay Balance",
"coupon_code": "AMZNPAY3",
},
{
"text": "Flat 3% cashback using Amazon Pay Balance",
"coupon_code": "AMZNPAY3",
},
];
@override
@@ -48,6 +60,7 @@ class AllCouponsBottomsheet extends StatelessWidget {
itemCount: coupons.length,
separatorBuilder: (_, __) => SizedBox(height: 12.h),
itemBuilder: (context, index) {
final coupon = coupons[index];
return Container(
alignment: Alignment.center,
padding: EdgeInsets.symmetric(horizontal: 8.w, vertical: 8.h),
@@ -58,44 +71,62 @@ class AllCouponsBottomsheet extends StatelessWidget {
color: const Color(0xFFF95F62).withOpacity(0.12),
),
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Image.asset(
width: 183.9.w,
height: 72.82.h,
coupons[index],
fit: BoxFit.cover,
),
GestureDetector(
onTap: (){
Navigator.pop(context);
showModalBottomSheet(
backgroundColor: Colors.white,
context: context,
isScrollControlled: true,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.vertical(
top: Radius.circular(12.r),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
SizedBox(
width: 220.w,
child: CustomText(
text: coupon['text'] ?? "",
size: 12.sp,
weight: FontWeight.w400,
),
),
GestureDetector(
onTap: () {
Navigator.pop(context);
PurchaseDetailsBottomSheet.show(context);
},
child: Container(
width: 110.w,
height: 44.h,
decoration: BoxDecoration(
color: Color(0xFFF95F62),
borderRadius: BorderRadius.circular(12.r),
),
child: Center(
child: CustomText(
text: "Apply Coupon",
size: 12.sp,
color: Colors.white,
),
),
builder: (_) => const PurchaseDetailsBottomsheet());
},
child: Container(
width: 110.w,
height: 44.h,
decoration: BoxDecoration(
color: Color(0xFFF95F62),
borderRadius: BorderRadius.circular(12.r),
),
child: Center(
child: CustomText(
text: "Apply Coupon",
size: 12.sp,
color: Colors.white,
),
),
],
),
SizedBox(height: 8.h),
Container(
height: 32.h,
width: 83.w,
decoration: BoxDecoration(
color: Color(0xFFF95F62).withOpacity(0.12),
border: Border.all(color: Color(0xFFF95F62)),
borderRadius: BorderRadius.circular(6.r),
),
child: Center(
child: CustomText(
text: coupon['coupon_code'] ?? "",
size: 12.sp,
weight: FontWeight.w400,
color: Color(0xFFF95F62),
),
),
),
],

1
lib/checkout/widget/login_email_bottomsheet.dart
View File

@@ -11,7 +11,6 @@ class LoginEmailBottomsheet extends StatelessWidget {
@override
Widget build(BuildContext context) {
return AnimatedPadding(
duration: const Duration(milliseconds: 250),
curve: Curves.easeOut,
padding: EdgeInsets.only(

217
lib/checkout/widget/purchase_details_bottomsheet.dart
View File

@@ -1,217 +0,0 @@
import 'package:citycards_customer/checkout/bloc/purchase_details_bloc.dart';
import 'package:citycards_customer/common_packages/custom_filled_button.dart';
import 'package:citycards_customer/common_packages/custom_text.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
class PurchaseDetailsBottomsheet extends StatelessWidget {
const PurchaseDetailsBottomsheet({super.key});
@override
Widget build(BuildContext context) {
return BlocProvider(
create: (_) => PurchaseDetailsBloc(),
child: AnimatedPadding(
duration: const Duration(milliseconds: 250),
curve: Curves.easeOut,
padding: EdgeInsets.only(
top: 24.h,
left: 20.w,
right: 20.w,
bottom: MediaQuery.of(context).viewInsets.bottom,
),
child: BlocBuilder<PurchaseDetailsBloc, PurchaseDetailsState>(
builder: (context, state) {
final selected = state.buyPassState;
return Column(
mainAxisSize: MainAxisSize.min,
children: [
// --- Handle Bar ---
Container(
height: 4.h,
width: 40.w,
decoration: BoxDecoration(
color: const Color(0xFF2D3134),
borderRadius: BorderRadius.circular(4.r),
),
),
SizedBox(height: 12.h),
CustomText(
text: "Purchase Details",
size: 18.sp,
weight: FontWeight.w600,
),
SizedBox(height: 22.h),
// --- Option 1: Buy for Myself ---
GestureDetector(
onTap: () {
context.read<PurchaseDetailsBloc>().add(
SetPurchaseDetailsEvent("myself"),
);
},
child: Container(
padding: EdgeInsets.all(6),
decoration: BoxDecoration(
border: Border.all(
color: selected == "myself"
? const Color(0xFFF95F62)
: Colors.transparent,
),
borderRadius: BorderRadius.circular(10.r),
),
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Icon(
selected == "myself"
? Icons.radio_button_checked
: Icons.radio_button_off,
color: selected == "myself"
? const Color(0xFFF95F62)
: Color(0xFF2B2929).withOpacity(.6),
size: 24.sp,
),
SizedBox(width: 8.w),
CustomText(
text: "Buy Pass for Myself",
color: selected == "myself"
? const Color(0xFFF95F62)
: Color(0xFF2B2929).withOpacity(.6),
size: 16.sp,
weight: FontWeight.w500,
),
],
),
if (selected == "myself") ...[
SizedBox(height: 6.h),
CustomText(
text: "Frank Adam",
size: 14.sp,
weight: FontWeight.w400,
color: Colors.black.withOpacity(0.6),
),
SizedBox(height: 4.h),
CustomText(
text: "132 My Street, Kingston, NY 12401",
size: 12.sp,
color: const Color(
0xFF000000,
).withOpacity(0.4),
),
],
],
),
),
if (selected == "myself")
Container(
padding: EdgeInsets.symmetric(
horizontal: 6.w,
vertical: 6.h,
),
decoration: BoxDecoration(
color: Color(0xFFF95F62).withOpacity(0.12),
border: Border.all(
color: const Color(0xFFF95F62),
width: 1,
),
borderRadius: BorderRadius.circular(12.r),
),
child: CustomText(
text: "Edit Details",
size: 16.sp,
weight: FontWeight.w500,
color: const Color(0xFFF95F62),
),
),
],
),
),
),
SizedBox(height: 16.h),
// --- Option 2: Gift the Pass ---
GestureDetector(
onTap: () {
context.read<PurchaseDetailsBloc>().add(
SetPurchaseDetailsEvent("gift"),
);
},
child: Container(
padding: EdgeInsets.all(12.w),
decoration: BoxDecoration(
border: Border.all(
color: selected == "gift"
? const Color(0xFFF95F62)
: Colors.transparent,
),
borderRadius: BorderRadius.circular(12.r),
),
child: Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Row(
children: [
Icon(
selected == "gift"
? Icons.radio_button_checked
: Icons.radio_button_off,
color: selected == "gift"
? const Color(0xFFF95F62)
: Color(0xFF2F2A2A).withOpacity(0.4),
size: 24.sp,
),
SizedBox(width: 8.w),
CustomText(
text: "Gift the pass",
color: selected == "gift"
? const Color(0xFFF95F62)
: Color(0xFF2F2A2A).withOpacity(0.4),
size: 16.sp,
weight: FontWeight.w500,
),
],
),
SizedBox(height: 6.h),
if (selected == "gift")
CustomText(
text: "Gift the pass for someone else",
size: 12.sp,
color: const Color(0xFF000000).withOpacity(0.6),
),
],
),
),
),
),
SizedBox(height: 24.h),
// --- Proceed Button ---
CustomFilledButton(
onTap: () {
Navigator.pop(context);
},
label: "Proceed",
width: double.infinity,
),
SizedBox(height: 20.h),
],
);
},
),
),
);
}
}

6
lib/core/app_router.dart
View File

@@ -10,6 +10,7 @@ import 'package:citycards_customer/edit_profile/edit_profile_view.dart';
import 'package:citycards_customer/esim_offer/esim_offer_view.dart';
import 'package:citycards_customer/faq/faq_view.dart';
import 'package:citycards_customer/hotel_offer/hotel_offer_view.dart';
import 'package:citycards_customer/intro_screens/views/intro_screen_view.dart';
import 'package:citycards_customer/itinerary_creation/bloc/itinerary_detail_bloc.dart';
import 'package:citycards_customer/itinerary_creation/bloc/itinerary_steps_selection_bloc.dart';
import 'package:citycards_customer/itinerary_creation/views/itinerary_creation_start_view.dart';
@@ -44,6 +45,11 @@ class AppRouter {
);
},
);
case RouteConstants.intro:
return MaterialPageRoute(builder: (_){
return IntroScreensView();
});
case RouteConstants.attractionsPage:
final args = settings.arguments as String;
return MaterialPageRoute(builder: (_) => AttractionsPage(source: args));

4
lib/core/route_constants.dart
View File

@@ -1,6 +1,10 @@
class RouteConstants {
static const String intro = 'intro';
/****************************** HOME SECTION ************************************/
static const String home = '/home';
static const String registeredUserHome = '/registeredUserHome';
static const String attractionsPage = "/attractions";

12
lib/intro_screens/blocs/intro_screens_bloc.dart Normal file
View File

@@ -0,0 +1,12 @@
import 'package:flutter_bloc/flutter_bloc.dart';
class IntroScreensState {
final int currentPage;
IntroScreensState({required this.currentPage});
}
class IntroScreensCubit extends Cubit<IntroScreensState> {
IntroScreensCubit() : super(IntroScreensState(currentPage: 0));
void updatePage(int index) => emit(IntroScreensState(currentPage: index));
}

11
lib/intro_screens/models/intro_screens_model.dart Normal file
View File

@@ -0,0 +1,11 @@
class IntroScreensModel {
final String image;
final String title;
final String description;
IntroScreensModel({
required this.image,
required this.title,
required this.description,
});
}

26
lib/intro_screens/repositories/intro_screens_repository.dart Normal file
View File

@@ -0,0 +1,26 @@
import '../models/intro_screens_model.dart';
class IntroScreensRepository {
List<IntroScreensModel> getIntroScreensData() {
return [
IntroScreensModel(
image: 'assets/images/splash1.png',
title: 'What we provide',
description:
'Discover cities like never before with CityCards! Buy passes for top attractions and enjoy exclusive discounts on hotels, eSIMs, and more.',
),
IntroScreensModel(
image: 'assets/images/splash2.png',
title: 'Manage Booking Seamlessly',
description:
'Easily manage and promote your attractions while connecting with travelers and handling bookings in one place.',
),
IntroScreensModel(
image: 'assets/images/splash3.jpg',
title: 'Postcard and Magic itinerary for your friends',
description:
'Craft your magic itinerary to explore the world effortlessly with CityCards, and send postcards to friends.',
),
];
}
}

8
lib/intro_screens/view_models/intro_screens_viewmodel.dart Normal file
View File

@@ -0,0 +1,8 @@
import '../repositories/intro_screens_repository.dart';
import '../models/intro_screens_model.dart';
class IntroScreensViewModel {
final IntroScreensRepository _repository = IntroScreensRepository();
List<IntroScreensModel> get pages => _repository.getIntroScreensData();
}

176
lib/intro_screens/views/intro_screen_view.dart Normal file
View File

@@ -0,0 +1,176 @@
import 'package:citycards_customer/core/route_constants.dart';
import 'package:citycards_customer/intro_screens/view_models/intro_screens_viewmodel.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_glass_morphism/flutter_glass_morphism.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import '../blocs/intro_screens_bloc.dart';
class IntroScreensView extends StatelessWidget {
final PageController _pageController = PageController();
final IntroScreensViewModel _viewModel = IntroScreensViewModel();
IntroScreensView({super.key});
@override
Widget build(BuildContext context) {
final pages = _viewModel.pages;
return BlocProvider(
create: (_) => IntroScreensCubit(),
child: Scaffold(
body: BlocBuilder<IntroScreensCubit, IntroScreensState>(
builder: (context, state) {
return Stack(
children: [
// Background PageView
PageView.builder(
controller: _pageController,
itemCount: pages.length,
onPageChanged: (index) =>
context.read<IntroScreensCubit>().updatePage(index),
itemBuilder: (context, index) {
final page = pages[index];
return Stack(
fit: StackFit.expand,
children: [
Image.asset(page.image, fit: BoxFit.cover),
Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Color(0xFF00000000), Color(0xFF000000)],
),
),
),
],
);
},
),
// Skip Button (Only first 2 pages)
if (state.currentPage < pages.length - 1)
Positioned(
top: 50,
right: 20,
child: GestureDetector(
onTap: (){
Navigator.pushReplacementNamed(context,RouteConstants.home);
},
child: Container(
height: 48.h,
width: 92.w,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(16.r),
border: Border.all(color: Colors.white),
),
child: Center(
child: Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 16.sp,
fontWeight: FontWeight.w500,
),
),
),
),
),
),
// Bottom Content
Align(
alignment: Alignment.bottomCenter,
child: GlassMorphismContainer(
blurIntensity: 0.5,
padding: EdgeInsets.symmetric(
horizontal: 24.w,
vertical: 17.h,
),
margin: const EdgeInsets.all(20),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(
pages[state.currentPage].title,
style: TextStyle(
color: Colors.white,
fontSize: 24.sp,
fontWeight: FontWeight.w500,
),
textAlign: TextAlign.center,
),
SizedBox(height: 8.h),
Text(
pages[state.currentPage].description,
style: TextStyle(
color: Colors.white,
fontSize: 14.sp,
),
textAlign: TextAlign.center,
),
SizedBox(height: 24.h),
// Dots Indicator
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: List.generate(
pages.length,
(index) => Container(
margin: const EdgeInsets.symmetric(
horizontal: 4.0,
),
width: 36.w,
height: 12.h,
decoration: BoxDecoration(
color: state.currentPage == index
? Color(0xFFF95F62)
: Color(0xFFF95F62).withOpacity(0.42),
borderRadius: BorderRadius.circular(12),
),
),
),
),
SizedBox(height: 24.h),
ElevatedButton(
style: ElevatedButton.styleFrom(
backgroundColor: Color(0xFFF95F62),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(16.r),
),
minimumSize: const Size(double.infinity, 52),
),
onPressed: () {
if (state.currentPage == pages.length - 1) {
Navigator.pushReplacementNamed(context, '/home');
} else {
_pageController.nextPage(
duration: const Duration(milliseconds: 400),
curve: Curves.easeInOut,
);
}
},
child: Text(
state.currentPage == pages.length - 1
? "Let's Get Started"
: 'Continue',
style: TextStyle(
color: Colors.white,
fontSize: 20.sp,
fontWeight: FontWeight.w600,
),
),
),
],
),
),
),
],
);
},
),
),
);
}
}

3
lib/main.dart
View File

@@ -1,5 +1,6 @@
import 'package:citycards_customer/cart/blocs/postcard_bloc.dart';
import 'package:citycards_customer/core/route_constants.dart';
import 'package:citycards_customer/trail.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
@@ -40,6 +41,8 @@ class MyApp extends StatelessWidget {
],
child: MaterialApp(
onGenerateRoute: _appRouter.onGenerateRoute,
// initialRoute: RouteConstants.intro,
home: LottieAnimationScreen(),
debugShowCheckedModeBanner: false,
title: 'City Cards',
theme: ThemeData(

44
lib/trail.dart
View File

@@ -196,3 +196,47 @@
// @override
// bool shouldRepaint(covariant CustomPainter oldDelegate) => false;
// }
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:lottie/lottie.dart';
class LottieAnimationScreen extends StatefulWidget {
const LottieAnimationScreen({super.key});
@override
State<LottieAnimationScreen> createState() => _LottieAnimationScreenState();
}
class _LottieAnimationScreenState extends State<LottieAnimationScreen> {
@override
void initState() {
super.initState();
// Delay for animation duration, then navigate to intro screens
Future.delayed(const Duration(seconds: 3), () {
Navigator.pushReplacementNamed(context, '/intro');
});
// Custom status bar color
SystemChrome.setSystemUIOverlayStyle(
const SystemUiOverlayStyle(
statusBarColor: Color(0xFFF95F62),
statusBarIconBrightness: Brightness.light,
),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: const Color(0xFFF95F62),
body: Center(
child: Lottie.asset(
'assets/intro/anim.json', // your animated Lottie file
fit: BoxFit.cover,
repeat: true,
),
),
);
}
}

16
pubspec.lock
View File

@@ -214,6 +214,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "9.1.1"
flutter_glass_morphism:
dependency: "direct main"
description:
name: flutter_glass_morphism
sha256: c5e5e7ecc73b43cd1e1231e2a12eae8dc6fb77ed47d44073f9fe25f59481d506
url: "https://pub.dev"
source: hosted
version: "1.0.2"
flutter_launcher_icons:
dependency: "direct main"
description:
@@ -549,6 +557,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "5.1.1"
lottie:
dependency: "direct main"
description:
name: lottie
sha256: "8ae0be46dbd9e19641791dc12ee480d34e1fd3f84c749adc05f3ad9342b71b95"
url: "https://pub.dev"
source: hosted
version: "3.3.2"
matcher:
dependency: transitive
description:

3
pubspec.yaml
View File

@@ -48,6 +48,8 @@ dependencies:
flutter_native_splash: ^2.4.7
shared_preferences: ^2.5.3
flutter_launcher_icons: ^0.14.4
flutter_glass_morphism: ^1.0.2
lottie: ^3.3.2
dev_dependencies:
flutter_test:
@@ -78,6 +80,7 @@ flutter:
- assets/icons/
- assets/dummy/
- assets/gif/
- assets/intro/
# An image asset can refer to one or more resolution-specific "variants", see
# https://flutter.dev/to/resolution-aware-images