new splash screen, deposit screen
This commit is contained in:
@@ -1,43 +1,15 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_bloc/flutter_bloc.dart';
|
||||
|
||||
import '../bloc/onboarding_bloc.dart';
|
||||
import '../bloc/onboarding_event.dart';
|
||||
import '../bloc/onboarding_state.dart';
|
||||
import '../widgets/build_page_widget.dart';
|
||||
import '../widgets/build_onboarding_page_widget.dart';
|
||||
|
||||
class WelcomeLayout extends StatelessWidget {
|
||||
final PageController _pageController = PageController();
|
||||
WelcomeLayout({super.key});
|
||||
const WelcomeLayout({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
return const Scaffold(
|
||||
backgroundColor: Colors.white,
|
||||
body: BlocListener<OnboardingBloc, OnboardingState>(
|
||||
// Define the listener for the BlocListener
|
||||
listener: (context, state) {
|
||||
// If the state is OnboardingPageChanged, animate to the corresponding page
|
||||
if (state is OnboardingPageChanged) {
|
||||
_pageController.animateToPage(
|
||||
state.currentPage,
|
||||
duration: const Duration(milliseconds: 300),
|
||||
curve: Curves.easeInOut,
|
||||
);
|
||||
}
|
||||
},
|
||||
child: PageView.builder(
|
||||
controller: _pageController,
|
||||
itemCount: 3, // Number of onboarding pages
|
||||
itemBuilder: (context, index) {
|
||||
return buildPage(context, index, _pageController);
|
||||
},
|
||||
onPageChanged: (index) {
|
||||
// Dispatch the JumpToPage event to update the current page
|
||||
context.read<OnboardingBloc>().add(JumpToPage(index));
|
||||
},
|
||||
),
|
||||
),
|
||||
body: BuildOnboardingPage(),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
import 'package:carousel_slider/carousel_slider.dart';
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
||||
import 'package:flutter_svg/flutter_svg.dart';
|
||||
@@ -5,64 +6,123 @@ import 'package:flutter_svg/svg.dart';
|
||||
import 'package:gap/gap.dart';
|
||||
import 'package:tanami_app/core/styles/app_color.dart';
|
||||
import 'package:tanami_app/core/styles/app_images.dart';
|
||||
import 'package:tanami_app/core/styles/app_text.dart';
|
||||
import 'package:tanami_app/shared/components/text_widget.dart';
|
||||
|
||||
import '../../../../core/utils/language/localizations_delegate.dart';
|
||||
import '../../../../shared/components/language_change_bottom_sheet.dart';
|
||||
import 'login_signup_button.dart';
|
||||
import 'welcome_indicator.dart';
|
||||
|
||||
Widget buildOnboardingPage(
|
||||
BuildContext context, {
|
||||
required int index,
|
||||
required String imageAsset,
|
||||
required String title,
|
||||
required String description,
|
||||
bool isLastPage = false,
|
||||
required PageController pageController,
|
||||
}) {
|
||||
return Column(
|
||||
children: [
|
||||
index == 0 ? const Gap(40) : const Gap(0),
|
||||
index == 0
|
||||
? Align(
|
||||
alignment: Alignment.centerRight,
|
||||
child: IconButton(
|
||||
onPressed: () {
|
||||
showLanguageBottomSheet(context);
|
||||
},
|
||||
icon: const Icon(
|
||||
Icons.language_outlined,
|
||||
size: 30,
|
||||
)),
|
||||
)
|
||||
: const SizedBox(),
|
||||
index == 0 ? const Gap(0) : const Gap(85),
|
||||
SvgPicture.asset(AppImages.welcomeLogo1),
|
||||
const Gap(50),
|
||||
Image.asset(
|
||||
imageAsset,
|
||||
width: 1.sw,
|
||||
height: 370,
|
||||
fit: BoxFit.cover,
|
||||
),
|
||||
const Gap(12),
|
||||
welcomeIndicator(pageController),
|
||||
const Gap(20),
|
||||
TextWidget().text15W500(
|
||||
title,
|
||||
clr: AppColor.darkGreyColor,
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 20,
|
||||
),
|
||||
child: TextWidget().text20W700(
|
||||
description,
|
||||
clr: AppColor.primaryColor,
|
||||
txtAlign: TextAlign.center,
|
||||
),
|
||||
),
|
||||
if (isLastPage) const LoginSignUpButton(),
|
||||
],
|
||||
);
|
||||
class BuildOnboardingPage extends StatefulWidget {
|
||||
const BuildOnboardingPage({super.key});
|
||||
|
||||
@override
|
||||
State<BuildOnboardingPage> createState() => _BuildOnboardingPageState();
|
||||
}
|
||||
|
||||
class _BuildOnboardingPageState extends State<BuildOnboardingPage> {
|
||||
int index = 0;
|
||||
final CarouselController _controller = CarouselController();
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
var localizations = AppLocalizations.of(context);
|
||||
List<String> welcomeImages = [
|
||||
AppImages.firstWelcome,
|
||||
AppImages.secondWelcome,
|
||||
AppImages.thirdWelcome,
|
||||
];
|
||||
List<String> welcomeTitle = [
|
||||
localizations.translate(AppText.welcomeTitle1Text),
|
||||
localizations.translate(AppText.welcomeTitle2Text),
|
||||
localizations.translate(AppText.welcomeTitle3Text),
|
||||
];
|
||||
List<String> welcomeDesc = [
|
||||
localizations.translate(AppText.welcomeDescription1Text),
|
||||
localizations.translate(AppText.welcomeDescription2Text),
|
||||
localizations.translate(AppText.welcomeDescription3Text),
|
||||
];
|
||||
return Column(
|
||||
children: [
|
||||
index == 0 ? const Gap(40) : const Gap(0),
|
||||
index == 0
|
||||
? Align(
|
||||
alignment: Alignment.centerRight,
|
||||
child: IconButton(
|
||||
onPressed: () {
|
||||
showLanguageBottomSheet(context);
|
||||
},
|
||||
icon: const Icon(
|
||||
Icons.language_outlined,
|
||||
size: 30,
|
||||
)),
|
||||
)
|
||||
: const SizedBox(),
|
||||
index == 0 ? const Gap(0) : const Gap(88),
|
||||
SvgPicture.asset(AppImages.welcomeLogo1),
|
||||
const Gap(50),
|
||||
CarouselSlider.builder(
|
||||
carouselController: _controller,
|
||||
itemCount: 3,
|
||||
itemBuilder:
|
||||
(BuildContext context, int itemIndex, int pageViewIndex) {
|
||||
return Image.asset(
|
||||
welcomeImages[itemIndex],
|
||||
fit: BoxFit.cover,
|
||||
width: 1.sw,
|
||||
height: 400.h,
|
||||
);
|
||||
},
|
||||
options: CarouselOptions(
|
||||
onPageChanged: (index, reason) {
|
||||
this.index = index;
|
||||
setState(() {});
|
||||
},
|
||||
reverse: false,
|
||||
autoPlay: false,
|
||||
enlargeCenterPage: false,
|
||||
viewportFraction: 1,
|
||||
enableInfiniteScroll: false,
|
||||
aspectRatio: 1.0,
|
||||
initialPage: 0,
|
||||
),
|
||||
),
|
||||
const Gap(12),
|
||||
Row(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: welcomeImages.asMap().entries.map((entry) {
|
||||
return GestureDetector(
|
||||
onTap: () => _controller.animateToPage(entry.key),
|
||||
child: Container(
|
||||
width: 12.0,
|
||||
height: 4.0,
|
||||
margin:
|
||||
const EdgeInsets.symmetric(vertical: 8.0, horizontal: 4.0),
|
||||
decoration: BoxDecoration(
|
||||
borderRadius: BorderRadius.circular(2),
|
||||
color: AppColor.primaryColor2
|
||||
.withOpacity(index == entry.key ? 1 : 0.3)),
|
||||
),
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
const Gap(20),
|
||||
TextWidget().text15W500(
|
||||
welcomeTitle[index],
|
||||
clr: AppColor.darkGreyColor,
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.symmetric(
|
||||
horizontal: 20,
|
||||
),
|
||||
child: TextWidget().text20W700(
|
||||
welcomeDesc[index],
|
||||
clr: AppColor.primaryColor,
|
||||
txtAlign: TextAlign.center,
|
||||
),
|
||||
),
|
||||
index == 2 ? const LoginSignUpButton() : const SizedBox(),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,43 +0,0 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:tanami_app/core/styles/app_images.dart';
|
||||
import 'package:tanami_app/core/styles/app_text.dart';
|
||||
|
||||
import '../../../../core/utils/language/localizations_delegate.dart';
|
||||
import 'build_onboarding_page_widget.dart';
|
||||
|
||||
Widget buildPage(
|
||||
BuildContext context, int index, PageController pageController) {
|
||||
var localizations = AppLocalizations.of(context);
|
||||
switch (index) {
|
||||
case 0:
|
||||
return buildOnboardingPage(
|
||||
pageController: pageController,
|
||||
index: index,
|
||||
context,
|
||||
imageAsset: AppImages.firstWelcome,
|
||||
title: localizations.translate(AppText.welcomeTitle1Text),
|
||||
description: localizations.translate(AppText.welcomeDescription1Text),
|
||||
);
|
||||
case 1:
|
||||
return buildOnboardingPage(
|
||||
pageController: pageController,
|
||||
index: index,
|
||||
context,
|
||||
imageAsset: AppImages.secondWelcome,
|
||||
title: localizations.translate(AppText.welcomeTitle2Text),
|
||||
description: localizations.translate(AppText.welcomeDescription2Text),
|
||||
);
|
||||
case 2:
|
||||
return buildOnboardingPage(
|
||||
pageController: pageController,
|
||||
index: index,
|
||||
context,
|
||||
imageAsset: AppImages.thirdWelcome,
|
||||
title: localizations.translate(AppText.welcomeTitle3Text),
|
||||
description: localizations.translate(AppText.welcomeDescription3Text),
|
||||
isLastPage: true,
|
||||
);
|
||||
default:
|
||||
return Container();
|
||||
}
|
||||
}
|
||||
@@ -1,17 +0,0 @@
|
||||
import 'package:flutter/cupertino.dart';
|
||||
import 'package:smooth_page_indicator/smooth_page_indicator.dart';
|
||||
|
||||
import '../../../../core/styles/app_color.dart';
|
||||
|
||||
Widget welcomeIndicator(PageController pageController) {
|
||||
return SmoothPageIndicator(
|
||||
controller: pageController,
|
||||
count: 3,
|
||||
effect: const ExpandingDotsEffect(
|
||||
activeDotColor: AppColor.indicatorActiveColor,
|
||||
dotColor: AppColor.indicatorInactiveColor,
|
||||
dotHeight: 10,
|
||||
dotWidth: 10,
|
||||
),
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user