home screen app_tour change

This commit is contained in:
Kalonkarthik 2025-02-05 12:23:16 +05:30
parent ec156e49dc
commit 969a2160a9

View File

@ -215,22 +215,7 @@ final _pb = PocketBase('https://pb.venbait.in');
late TutorialCoachMark tutorialCoachMark;
late List<TargetFocus> homeTargets;
late List<TargetFocus> previousHomeTargets;
Offset _imageCardPosition =Offset.zero;
Offset _imageTopicPosition =Offset.zero;
void _calculateCardPosition() {
final RenderBox cardRenderBox = cardsKey.currentContext!.findRenderObject() as RenderBox;
final Offset cardPosition = cardRenderBox.localToGlobal(Offset.zero);
final Size cardSize = cardRenderBox.size;
// Calculate the position for the image
final double imageX = cardPosition.dx + cardSize.width / 2;
final double imageY = cardPosition.dy + cardSize.height;
setState(() {
_imageCardPosition = Offset(imageX, imageY);
});
}
void handleSkip() {
tutorialCoachMark.skip();
@ -246,6 +231,7 @@ final _pb = PocketBase('https://pb.venbait.in');
//Method waits app tour to render Targets
void _starTourRender() {
if (cardTopicKey.currentContext != null) {
print('render finished');
_showHomeTour();
} else {
Future.delayed(Duration(milliseconds: 100), _starTourRender);
@ -261,7 +247,6 @@ final _pb = PocketBase('https://pb.venbait.in');
if (!homeTour) {
// Show Home Tour
_initTarget();
_calculateCardPosition();
tutorialCoachMark = TutorialCoachMark(
paddingFocus: 0,
useSafeArea: true,
@ -272,7 +257,7 @@ final _pb = PocketBase('https://pb.venbait.in');
ref.read(homeTourProvider.notifier).state = true;
ref.read(chartsTourProvider.notifier).state = false;
debugPrint('Home Tutorial Finished');
context.push('/marriages');
context.go('/chartScreen/hotels?bgColor=0xFF90B0D5&mainTopic=ECONOMY&title=Hotel+Establishments');
},
)..show(context: context);
} else if (!previousHomeTour) {
@ -286,7 +271,7 @@ final _pb = PocketBase('https://pb.venbait.in');
onFinish: () {
ref.read(previousHomeTourProvider.notifier).state = true;
debugPrint('Previous Home Tutorial Finished');
context.push('/marriages');
context.go('/chartScreen/hotels?bgColor=0xFF90B0D5&mainTopic=ECONOMY&title=Hotel+Establishments');
},
)..show(context: context);
}
@ -294,108 +279,113 @@ final _pb = PocketBase('https://pb.venbait.in');
}
void _initTarget(){
final double screenWidth = MediaQuery.of(context).size.width;
homeTargets=[
TargetFocus(
identify: 'cardTopicKey',
keyTarget: cardTopicKey,
shape: ShapeLightFocus.RRect,
radius: 8,
paddingFocus: 16,
contents: [
createTargetContent(
text: AppLocalizations.of(context)!.home_topic,
alignment: ContentAlign.bottom,
gap: 45,
space: 40,
gap: 0,
space: 43,
),
TargetContent(
align: ContentAlign.bottom,
child: SizedBox(
width: double.infinity,
height: MediaQuery.of(context).size.height*0.69,
height: MediaQuery.of(context).size.height*0.70,
child: Stack(
children: [
Positioned(
bottom: 35,
left: 16,
right: 16,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
ElevatedButton(
onPressed: () => handleSkip(),
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
side: const BorderSide(color: Colors.white),
backgroundColor: Colors.transparent,
elevation: 0,
),
child: const Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 14,
),
),
),
Column(
children: [
Text(
'1/7',
style: const TextStyle(
color: Colors.white,
fontSize: 14,
bottom: 20,
left: 16,
right: 16,
child: Column(
children: [
Align(
alignment: Alignment.bottomRight,
child: Padding(
padding: const EdgeInsets.only(right: 10), // Adjust the value as needed
child: Text(
'1/7',
style: const TextStyle(
color: Colors.white,
fontSize: 14,
),
),
),
const SizedBox(height: 3),
Row(
children: [
const SizedBox(width: 10),
Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Color(0xFF7DAFBC),
border: Border.all(color: Color(0xFF7DAFBC), width: 1),
),
SizedBox(height: 5,),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
ElevatedButton(
onPressed: () => handleSkip(),
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
child: IconButton(
padding: EdgeInsets.zero,
iconSize: 20,
icon: const Icon(Icons.arrow_forward, color: Colors.white),
onPressed: () {
tutorialCoachMark.next();
},
side: const BorderSide(color: Colors.white),
backgroundColor: Colors.transparent,
elevation: 0,
),
child: const Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 14,
),
),
],
),
],
),
],
),
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
const SizedBox(width: 10),
Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Color(0xFF7DAFBC),
border: Border.all(color: Color(0xFF7DAFBC), width: 1),
),
child: IconButton(
padding: EdgeInsets.zero,
iconSize: 20,
icon: const Icon(Icons.arrow_forward, color: Colors.white),
onPressed: () {
tutorialCoachMark.next();
},
),
),
],
),
],
),
],
)
),
],
),
),
),
TargetContent(
padding: EdgeInsets.only(left: screenWidth * 0.4, bottom: 0),
align: ContentAlign.bottom,
child: SizedBox(
width: MediaQuery.of(context).size.width,
height:MediaQuery.of(context).size.height*0.69 ,
child: Container(
width: 200,
height: 77,
child: Stack(
children: [
Positioned(
left: MediaQuery.of(context).size.width*0.4,
top: _imageCardPosition.dy-29,
child: Image.asset(
'assets/app_tour/down_right.png',
width: 40,
height: 90,
),
),
]
children: [
Image.asset(
'assets/app_tour/right_down.png',
fit: BoxFit.contain,
),
],
),
),
),
],
@ -404,13 +394,15 @@ final _pb = PocketBase('https://pb.venbait.in');
identify: 'cardsKey',
keyTarget: cardsKey,
shape: ShapeLightFocus.RRect,
radius: 7,
paddingFocus: 6,
// targetPosition:TargetPosition(),
contents: [
createTargetContent(
text:AppLocalizations.of(context)!.economy,
alignment: ContentAlign.bottom,
gap: 0,
space: 40,),
space: 43,),
TargetContent(
align: ContentAlign.bottom,
child:
@ -423,37 +415,43 @@ final _pb = PocketBase('https://pb.venbait.in');
bottom: 25,
left: 16,
right: 16,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
child: Column(
children: [
ElevatedButton(
onPressed: () =>handleSkip,
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
side: const BorderSide(color: Colors.white),
backgroundColor: Colors.transparent,
elevation: 0,
),
child: const Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 14,
),
),
Align(
alignment: Alignment.bottomRight,
child:Padding(padding: EdgeInsets.only(right: 10),
child:
Text(
'2/7',
style: const TextStyle(
color: Colors.white,
fontSize: 14,
),
),
)
),
Column(
const SizedBox(height: 3),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'2/7',
style: const TextStyle(
color: Colors.white,
fontSize: 14,
ElevatedButton(
onPressed: () =>handleSkip(),
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
side: const BorderSide(color: Colors.white),
backgroundColor: Colors.transparent,
elevation: 0,
),
child: const Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 14,
),
),
),
const SizedBox(height: 3),
Row(
children: [
Container(
@ -496,43 +494,62 @@ final _pb = PocketBase('https://pb.venbait.in');
),
),
TargetContent(
padding: EdgeInsets.only(left: screenWidth * 0.4, bottom: 0),
align: ContentAlign.bottom,
child: SizedBox(
width: MediaQuery.of(context).size.width ,
height:MediaQuery.of(context).size.height*0.69 ,
child: Container(
width: 200,
height: 77,
child: Stack(
children: [
Positioned(
left: MediaQuery.of(context).size.width*0.40,
top: _imageTopicPosition.dy-29,
child: Image.asset(
'assets/app_tour/down_right.png',
width: 40,
height: 90,
),
),
]
children: [
Image.asset(
'assets/app_tour/right_down.png',
fit: BoxFit.contain,
),
],
),
),
),
// TargetContent(
// align: ContentAlign.bottom,
// child: SizedBox(
// width: MediaQuery.of(context).size.width ,
// height:MediaQuery.of(context).size.height*0.69 ,
// child: Stack(
// children: [
// Positioned(
// left: MediaQuery.of(context).size.width*0.40,
// top: _imageTopicPosition.dy-29,
// child: Image.asset(
// 'assets/app_tour/right_down.png',
// width: 40,
// height: 90,
// ),
// ),
// ]
// ),
//
// ),
// ),
],
),
];
}
void _initPreviousTarget(){
final double screenWidth = MediaQuery.of(context).size.width;
previousHomeTargets=[
TargetFocus(
identify: 'cardsKey',
keyTarget: cardsKey,
shape: ShapeLightFocus.RRect,
radius: 7,
paddingFocus: 6,
contents: [
createTargetContent(
text:AppLocalizations.of(context)!.economy,
alignment: ContentAlign.bottom,
gap: 0,
space: 40,),
space: 43,),
TargetContent(
align: ContentAlign.bottom,
child:
@ -545,67 +562,79 @@ final _pb = PocketBase('https://pb.venbait.in');
bottom: 25,
left: 16,
right: 16,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
child: Column(
children: [
ElevatedButton(
onPressed: () =>handleSkip(),
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
side: const BorderSide(color: Colors.white),
backgroundColor: Colors.transparent,
elevation: 0,
),
child: const Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 14,
),
),
Align(
alignment: Alignment.bottomRight,
child:Padding(padding: EdgeInsets.only(right: 10),
child:
Text(
'2/7',
style: const TextStyle(
color: Colors.white,
fontSize: 14,
),
),
)
),
Column(
SizedBox(height: 5,),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
'2/7',
style: const TextStyle(
color: Colors.white,
fontSize: 14,
ElevatedButton(
onPressed: () =>handleSkip(),
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
side: const BorderSide(color: Colors.white),
backgroundColor: Colors.transparent,
elevation: 0,
),
child: const Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 14,
),
),
),
const SizedBox(height: 3),
Row(
children: [
Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(color: Colors.white, width: 2.0),
),
child: IconButton(
icon: const Icon(Icons.arrow_back, color: Colors.white),
onPressed: () {
tutorialCoachMark.next();
},
),
),
const SizedBox(width: 10),
Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Color(0xFF7DAFBC),
border: Border.all(color: Color(0xFF7DAFBC), width: 1.5),
),
child: IconButton(
iconSize: 20,
icon: const Icon(Icons.arrow_forward, color: Colors.white),
onPressed: () {
ref.read(previousHomeTourProvider.notifier).state=true;
ref.read(chartsTourProvider.notifier).state=false;
tutorialCoachMark.finish();
},
),
Row(
children: [
Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
border: Border.all(color: Colors.white, width: 2.0),
),
child: IconButton(
icon: const Icon(Icons.arrow_back, color: Colors.white),
onPressed: () {
tutorialCoachMark.next();
},
),
),
const SizedBox(width: 10),
Container(
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Color(0xFF7DAFBC),
border: Border.all(color: Color(0xFF7DAFBC), width: 1.5),
),
child: IconButton(
iconSize: 20,
icon: const Icon(Icons.arrow_forward, color: Colors.white),
onPressed: () {
ref.read(previousHomeTourProvider.notifier).state=true;
ref.read(chartsTourProvider.notifier).state=false;
context.go('/chartScreen/hotels?bgColor=0xFF90B0D5&mainTopic=ECONOMY&title=Hotel+Establishments');
tutorialCoachMark.finish();
},
),
),
],
),
],
),
@ -619,24 +648,19 @@ final _pb = PocketBase('https://pb.venbait.in');
),
),
TargetContent(
padding: EdgeInsets.only(left: screenWidth * 0.4, bottom: 0),
align: ContentAlign.bottom,
child: SizedBox(
width: MediaQuery.of(context).size.width,
height:MediaQuery.of(context).size.height*0.69 ,
child: Container(
width: 200,
height: 77,
child: Stack(
children: [
Positioned(
left: MediaQuery.of(context).size.width*0.40,
top: _imageTopicPosition.dy-29,
child: Image.asset(
'assets/app_tour/down_right.png',
width: 40,
height: 90,
),
),
]
children: [
Image.asset(
'assets/app_tour/right_down.png',
fit: BoxFit.contain,
),
],
),
),
),
],
@ -645,12 +669,14 @@ final _pb = PocketBase('https://pb.venbait.in');
identify: 'cardTopicKey',
keyTarget: cardTopicKey,
shape: ShapeLightFocus.RRect,
radius: 8,
paddingFocus: 16,
contents: [
createTargetContent(
text:AppLocalizations.of(context)!.home_topic,
alignment: ContentAlign.bottom,
gap: 45,
space: 40,
gap: 0,
space: 43,
),
TargetContent(
align: ContentAlign.bottom,
@ -660,43 +686,48 @@ final _pb = PocketBase('https://pb.venbait.in');
child: Stack(
children: [
Positioned(
bottom: 35,
bottom: 20,
left: 16,
right: 16,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
child: Column(
children: [
ElevatedButton(
onPressed: () {
tutorialCoachMark.skip();
debugPrint('Skip clicked');
},
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
side: const BorderSide(color: Colors.white),
backgroundColor: Colors.transparent,
elevation: 0,
),
child: const Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 14,
),
),
),
Column(
children: [
Text(
Align(
alignment: Alignment.bottomRight,
child: Padding(
padding:EdgeInsets.only(right: 10),
child: Text(
'1/7',
style: const TextStyle(
color: Colors.white,
fontSize: 14,
),
),
const SizedBox(height: 3),
),
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
ElevatedButton(
onPressed: () {
tutorialCoachMark.skip();
debugPrint('Skip clicked');
},
style: ElevatedButton.styleFrom(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12),
),
side: const BorderSide(color: Colors.white),
backgroundColor: Colors.transparent,
elevation: 0,
),
child: const Text(
'Skip',
style: TextStyle(
color: Colors.white,
fontSize: 14,
),
),
),
Row(
children: [
const SizedBox(width: 10),
@ -726,24 +757,19 @@ final _pb = PocketBase('https://pb.venbait.in');
),
),
TargetContent(
padding: EdgeInsets.only(left: screenWidth * 0.4, bottom: 0),
align: ContentAlign.bottom,
child: SizedBox(
width: MediaQuery.of(context).size.width,
height:MediaQuery.of(context).size.height*0.69 ,
child: Container(
width: 200,
height: 77,
child: Stack(
children: [
Positioned(
left: MediaQuery.of(context).size.width*0.4,
top: _imageCardPosition.dy-29,
child: Image.asset(
'assets/app_tour/down_right.png',
width: 40,
height: 90,
),
),
]
children: [
Image.asset(
'assets/app_tour/right_down.png',
fit: BoxFit.contain,
),
],
),
),
),
],