Merge branch 'master' into dev_aamir

Reviewed-on: #57

assets/animations/lottie/splash_launching.json

@@ -0,0 +1 @@
+{"nm":"Splash Launch 1","ddd":0,"h":927,"w":430,"meta":{"g":"LottieFiles Figma v92"},"layers":[{"ty":4,"nm":"Ellipse 54","sr":1,"st":0,"op":121.06,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":1,"k":[{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[19.5,19.5],"t":0},{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[19.5,19.5],"t":60},{"s":[628.5,628.5],"t":120}]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[216,464],"t":0},{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[216.5,464.5],"t":60},{"s":[225.5,473.5],"t":120}]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":1,"k":[{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[0],"t":0},{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[0],"t":60},{"s":[100],"t":120}]}},"shapes":[{"ty":"sh","bm":0,"hd":false,"nm":"","d":1,"ks":{"a":1,"k":[{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[{"c":true,"i":[[0,0],[10.493846153846153,0],[0,10.493846153846153],[-10.493846153846153,0],[0,-10.493846153846153]],"o":[[0,10.493846153846153],[-10.493846153846153,0],[0,-10.493846153846153],[10.493846153846153,0],[0,0]],"v":[[38,19],[19,38],[0,19],[19,0],[38,19]]}],"t":0},{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[{"c":true,"i":[[0,0],[10.493846153846153,0],[0,10.493846153846153],[-10.493846153846153,0],[0,-10.493846153846153]],"o":[[0,10.493846153846153],[-10.493846153846153,0],[0,-10.493846153846153],[10.493846153846153,0],[0,0]],"v":[[38,19],[19,38],[0,19],[19,0],[38,19]]}],"t":60},{"s":[{"c":true,"i":[[0,0],[341.5871678599841,0],[0,341.5871678599841],[-341.5871678599841,0],[0,-341.5871678599841]],"o":[[0,341.5871678599841],[-341.5871678599841,0],[0,-341.5871678599841],[341.5871678599841,0],[0,0]],"v":[[1237,618.5],[618.5,1237],[0,618.5],[618.5,0],[1237,618.5]]}],"t":120}]}},{"ty":"st","bm":0,"hd":false,"nm":"","lc":1,"lj":1,"ml":4,"o":{"a":1,"k":[{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[20],"t":0},{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[20],"t":60},{"s":[100],"t":120}]},"w":{"a":1,"k":[{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[1],"t":0},{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[1],"t":60},{"s":[20],"t":120}]},"c":{"a":0,"k":[0.9295,0.1098,0.1687]}},{"ty":"fl","bm":0,"hd":false,"nm":"","c":{"a":0,"k":[1,1,1]},"r":1,"o":{"a":0,"k":100}}],"ind":1},{"ty":4,"nm":"Group 8232","sr":1,"st":0,"op":121.06,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[0,0]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[155,404]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":1,"k":[{"o":{"x":0,"y":0},"i":{"x":1,"y":1},"s":[0],"t":0},{"o":{"x":0,"y":0},"i":{"x":1,"y":1},"s":[0],"t":60.06},{"s":[100],"t":120}]}},"shapes":[],"ind":2},{"ty":4,"nm":"Rectangle 17364","sr":1,"st":0,"op":121.06,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[200,326.5]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":1,"k":[{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[-207.54,1178.76],"t":0},{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[565.46,-310.24],"t":60},{"s":[565.46,-310.24],"t":120.12}]},"r":{"a":0,"k":30},"sa":{"a":0,"k":0},"o":{"a":1,"k":[{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[100],"t":0},{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[100],"t":60},{"s":[0],"t":120.12}]}},"shapes":[{"ty":"sh","bm":0,"hd":false,"nm":"","d":1,"ks":{"a":0,"k":{"c":true,"i":[[0,-110.38],[0,0],[110.38,0],[0,0],[0,110.38],[0,0],[-110.38,0],[0,0]],"o":[[0,0],[0,110.38],[0,0],[-110.38,0],[0,0],[0,-110.38],[0,0],[110.38,0]],"v":[[400,200],[400,453],[200,653],[200,653],[0,453],[0,200],[200,0],[200,0]]}}},{"ty":"fl","bm":0,"hd":false,"nm":"","c":{"a":0,"k":[0.9295,0.1098,0.1687]},"r":1,"o":{"a":0,"k":100}}],"ind":3},{"ty":4,"nm":"Symptoms Checker Bg","sr":1,"st":0,"op":121.06,"ip":0,"hd":false,"ddd":0,"bm":0,"hasMask":false,"ao":0,"ks":{"a":{"a":0,"k":[215,463.5]},"s":{"a":0,"k":[100,100]},"sk":{"a":0,"k":0},"p":{"a":0,"k":[215,463.5]},"r":{"a":0,"k":0},"sa":{"a":0,"k":0},"o":{"a":0,"k":100}},"shapes":[{"ty":"sh","bm":0,"hd":false,"nm":"","d":1,"ks":{"a":0,"k":{"c":true,"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[430,0],[430,927],[0,927],[0,0]]}}},{"ty":"fl","bm":0,"hd":false,"nm":"","c":{"a":1,"k":[{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[1,1,1],"t":0},{"o":{"x":0.82,"y":-0.01},"i":{"x":0.58,"y":1},"s":[1,1,1],"t":60},{"s":[0.9295,0.1098,0.1687],"t":120}]},"r":1,"o":{"a":0,"k":100}}],"ind":4}],"v":"5.7.0","fr":60,"op":120.06,"ip":0,"assets":[]}

lib/core/app_assets.dart

@@ -166,6 +166,9 @@ class AppAnimations {
   static const String register = '$lottieBasePath/register.json';
   static const String checkmark = '$lottieBasePath/checkmark.json';
   static const String loadingAnimation = '$lottieBasePath/Loader.json';
+  static const String onboarding_1 = '$lottieBasePath/onboarding_1.json';
+  static const String onboarding_2 = '$lottieBasePath/onboarding_2.json';
   static const String errorAnimation = '$lottieBasePath/ErrorAnimation.json';
   static const String warningAnimation = '$lottieBasePath/warningAnimation.json';
+  static const String splashLaunching = '$lottieBasePath/splash_launching.json';
 }

lib/core/location_util.dart

@@ -215,7 +215,7 @@ class LocationUtils {
 
       HmsLocation.Location data = await locationService.getLastLocation();
       if (data.latitude == null || data.longitude == null) {
-        appState.resetLocation();
+        appState.resetLocation();  
         HmsLocation.LocationRequest request = HmsLocation.LocationRequest()
           ..priority = HmsLocation.LocationRequest.PRIORITY_HIGH_ACCURACY
           ..interval = 1000 // 1 second

lib/presentation/lab/lab_orders_page.dart

@@ -16,9 +16,9 @@ import 'package:hmg_patient_app_new/presentation/lab/lab_result_item_view.dart';
 import 'package:hmg_patient_app_new/presentation/lab/search_lab_report.dart';
 import 'package:hmg_patient_app_new/theme/colors.dart';
 import 'package:hmg_patient_app_new/widgets/chip/custom_chip_widget.dart';
-import 'package:hmg_patient_app_new/widgets/custom_tab_bar.dart';
+import 'package:hmg_patient_app_new/widgets/routes/custom_page_route.dart';
 import 'package:provider/provider.dart';
-
+import 'package:hmg_patient_app_new/widgets/custom_tab_bar.dart';
 import 'collapsing_list_view.dart';
 
 class LabOrdersPage extends StatefulWidget {
@@ -54,7 +54,13 @@ class _LabOrdersPageState extends State<LabOrdersPage> {
             if (lavVM.isLabOrdersLoading) {
               return;
             } else {
-              String? value = await Navigator.of(context).push(CupertinoPageRoute(fullscreenDialog: true, builder: (context) => SearchLabResultsContent(labSuggestionsList: lavVM.labSuggestions)));
+              String? value = await Navigator.of(context).push(
+                CustomPageRoute(
+                  page: SearchLabResultsContent(labSuggestionsList: lavVM.labSuggestions),
+                  fullScreenDialog: true,
+                  direction: AxisDirection.down,
+                ),
+              );
               if (value != null) {
                 selectedFilterText = value;
                 lavVM.filterLabReports(value);

lib/presentation/onboarding/onboarding_screen.dart

@@ -0,0 +1,173 @@
+import 'package:flutter/material.dart';
+import 'package:hmg_patient_app_new/core/app_assets.dart';
+import 'package:hmg_patient_app_new/core/utils/size_utils.dart';
+import 'package:hmg_patient_app_new/extensions/int_extensions.dart';
+import 'package:hmg_patient_app_new/extensions/string_extensions.dart';
+import 'package:hmg_patient_app_new/extensions/widget_extensions.dart';
+import 'package:hmg_patient_app_new/presentation/home/navigation_screen.dart';
+import 'package:hmg_patient_app_new/theme/colors.dart';
+import 'package:hmg_patient_app_new/widgets/buttons/custom_button.dart';
+import 'package:hmg_patient_app_new/widgets/transitions/fade_page.dart';
+import 'package:lottie/lottie.dart';
+
+class OnboardingScreen extends StatefulWidget {
+  OnboardingScreen({Key? key}) : super(key: key);
+
+  @override
+  _OnboardingScreenState createState() {
+    return _OnboardingScreenState();
+  }
+}
+
+class _OnboardingScreenState extends State<OnboardingScreen> {
+  int selectedIndex = 0;
+
+  late PageController pageController;
+
+  void goToHomePage() => Navigator.of(context).pushReplacement(FadePage(page: LandingNavigation()));
+
+  @override
+  void initState() {
+    super.initState();
+    pageController = PageController();
+  }
+
+  @override
+  void dispose() {
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: AppColors.whiteColor,
+      body: SafeArea(
+        top: false,
+        left: false,
+        right: false,
+        child: Column(
+          spacing: 24,
+          children: [
+            PageView(
+              controller: pageController,
+              children: [
+                onboardingView(
+                  AppAnimations.onboarding_1,
+                  "Booking appointment has never been easy".needTranslation,
+                  "In few clicks find yourself having consultation with the doctor of your choice.".needTranslation,
+                ),
+                onboardingView(
+                  AppAnimations.onboarding_2,
+                  "Access the medical history on finger tips".needTranslation,
+                  "Keep track on your medical history including labs, prescription, insurance, etc".needTranslation,
+                ),
+              ],
+              onPageChanged: (int index) {
+                selectedIndex = index;
+                setState(() {});
+              },
+            ).expanded,
+            Row(
+              spacing: 4.h,
+              children: [
+                AnimatedContainer(
+                  duration: const Duration(milliseconds: 250),
+                  height: 6.h,
+                  width: selectedIndex == 0 ? 18.h : 6.h,
+                  decoration: BoxDecoration(color: selectedIndex == 0 ? AppColors.textColor : AppColors.inputLabelTextColor, borderRadius: BorderRadius.circular(30)),
+                ),
+                AnimatedContainer(
+                  duration: const Duration(milliseconds: 250),
+                  height: 6.h,
+                  width: selectedIndex == 1 ? 18.h : 6.h,
+                  decoration: BoxDecoration(color: selectedIndex == 1 ? AppColors.textColor : AppColors.inputLabelTextColor, borderRadius: BorderRadius.circular(30)),
+                ),
+              ],
+            ).paddingOnly(left: 24, right: 24),
+            Row(
+              children: [
+                AnimatedSwitcher(
+                  duration: const Duration(milliseconds: 250),
+                  transitionBuilder: (child, anim) => FadeTransition(opacity: anim, child: child),
+                  child: selectedIndex == 0
+                      ? CustomButton(
+                          text: "Skip".needTranslation,
+                          onPressed: () => goToHomePage(),
+                          width: 86.h,
+                          height: 56.h,
+                          borderRadius: 12.h,
+                          backgroundColor: Color(0xffFEE9EA),
+                          textColor: AppColors.primaryRedColor,
+                          borderWidth: 0,
+                          borderColor: Colors.transparent,
+                        ).paddingOnly(left: 24)
+                      : const SizedBox.shrink(),
+                ),
+                const Spacer(),
+                AnimatedContainer(
+                  duration: const Duration(milliseconds: 400),
+                  curve: Curves.easeInOut,
+                  width: selectedIndex == 0 ? 86 : MediaQuery.of(context).size.width - 48,
+                  margin: EdgeInsets.only(left: 24, right: 24),
+                  decoration: BoxDecoration(
+                    color: AppColors.primaryRedColor,
+                    borderRadius: BorderRadius.circular(12),
+                  ),
+                  child: AnimatedSwitcher(
+                    duration: const Duration(milliseconds: 250),
+                    transitionBuilder: (child, anim) => FadeTransition(opacity: anim, child: child),
+                    child: selectedIndex == 0
+                        ? CustomButton(
+                            icon: AppAssets.arrow_forward,
+                            iconSize: 32.h,
+                            width: 86.h,
+                            height: 56.h,
+                            borderRadius: 12.h,
+                            text: "".needTranslation,
+                            backgroundColor: Colors.transparent,
+                            onPressed: () {
+                              pageController.animateToPage(1, duration: Duration(milliseconds: 400), curve: Curves.easeInOut);
+                            })
+                        : CustomButton(
+                            text: "Get Started".needTranslation,
+                            fontWeight: FontWeight.w500,
+                            fontSize: 16.h,
+                            height: 56.h,
+                            borderRadius: 16.h,
+                            textOverflow: TextOverflow.ellipsis,
+                            backgroundColor: Colors.transparent,
+                            onPressed: () => goToHomePage(),
+                          ),
+                  ),
+                ),
+              ],
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Widget onboardingView(String icon, String heading, String body) {
+    return Column(
+      mainAxisAlignment: MainAxisAlignment.end,
+      crossAxisAlignment: CrossAxisAlignment.start,
+      spacing: 12,
+      children: [
+        Align(
+                alignment: Alignment.bottomCenter,
+                child: Lottie.asset(icon, repeat: true, reverse: false, frameRate: FrameRate(60), width: MediaQuery.sizeOf(context).width - 50, height: MediaQuery.sizeOf(context).width - 50))
+            .expanded,
+        // 12.height,
+        Text(
+          heading,
+          style: TextStyle(fontSize: 36.h, fontWeight: FontWeight.w600, color: AppColors.textColor, letterSpacing: -0.4, height: 1),
+        ),
+        Text(
+          body,
+          style: TextStyle(fontSize: 16.h, fontWeight: FontWeight.w500, color: AppColors.greyTextColor, letterSpacing: 0, height: 26 / 16),
+        ),
+      ],
+    ).paddingOnly(left: 24, right: 24);
+  }
+}

lib/presentation/onboarding/splash_animation_screen.dart

@@ -0,0 +1,383 @@
+import 'dart:async';
+
+import 'package:flutter/material.dart';
+import 'package:hmg_patient_app_new/core/app_assets.dart';
+import 'package:hmg_patient_app_new/core/app_export.dart';
+import 'package:hmg_patient_app_new/extensions/widget_extensions.dart';
+import 'package:hmg_patient_app_new/presentation/authentication/login.dart';
+import 'package:hmg_patient_app_new/presentation/home/navigation_screen.dart';
+import 'package:hmg_patient_app_new/theme/colors.dart';
+import 'package:hmg_patient_app_new/widgets/transitions/fade_page.dart';
+import 'package:lottie/lottie.dart';
+
+class SplashAnimationScreen extends StatefulWidget {
+  final Widget? routeWidget;
+
+  SplashAnimationScreen({super.key, this.routeWidget});
+
+  @override
+  _SplashAnimationScreenState createState() {
+    return _SplashAnimationScreenState();
+  }
+}
+
+class _SplashAnimationScreenState extends State<SplashAnimationScreen> with SingleTickerProviderStateMixin {
+  late final AnimationController _controller;
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = AnimationController(vsync: this);
+    _controller.addListener(() {
+      if (_controller.status == AnimationStatus.completed) {
+        Navigator.of(context).pushReplacement(FadePage(page: widget.routeWidget ?? LandingNavigation()));
+      }
+    });
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: AppColors.whiteColor,
+      body: Stack(
+        children: [
+          Lottie.asset(AppAnimations.splashLaunching, controller: _controller, width: double.infinity, height: double.infinity, onLoaded: (composition) {
+            _controller
+              ..duration = composition.duration
+              ..forward(); // Start the animation
+          }, repeat: false, reverse: false, frameRate: FrameRate(60), fit: BoxFit.fill)
+              .center,
+        ],
+      ),
+    );
+  }
+}
+
+// todo: do-not remove this code,as animation need to test on multiple screen sizes
+
+class AnimatedScreen extends StatefulWidget {
+  const AnimatedScreen({super.key});
+
+  @override
+  State<AnimatedScreen> createState() => _AnimatedScreenState();
+}
+
+class _AnimatedScreenState extends State<AnimatedScreen> with TickerProviderStateMixin {
+  late AnimationController _moveController;
+  late Animation<Offset> _positionAnimation;
+  late AnimationController _expandController;
+  late Animation<double> _expandAnimation;
+
+  bool isRipple = false;
+  late final AnimationController _controller;
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = AnimationController(vsync: this);
+    _controller.addListener(() {
+      if (_controller.status == AnimationStatus.completed) {
+        // Navigator.of(context).pushReplacement(
+        //   FadePage(
+        //     page: LoginScreen(),
+        //   ),
+        // );
+      }
+    });
+
+    // Step 1: Move circle from bottom-left to top-right
+    _moveController = AnimationController(vsync: this, duration: const Duration(seconds: 1));
+    _positionAnimation = Tween<Offset>(
+      begin: const Offset(-1, 1),
+      end: const Offset(1, -1),
+    ).animate(
+      CurvedAnimation(parent: _moveController, curve: const Cubic(0.82, -0.01, 0.58, 1)),
+    );
+
+    // Step 2: Expand white circle from center
+    _expandController = AnimationController(vsync: this, duration: const Duration(milliseconds: 1000));
+    _expandAnimation = Tween<double>(
+      begin: 0.0,
+      end: 4.0,
+    ).animate(CurvedAnimation(parent: _expandController, curve: Curves.easeOut));
+
+    // Trigger the animations in sequence
+    _moveController.forward().whenComplete(() {
+      setState(() {
+        isRipple = true;
+      });
+      _expandController.forward().whenComplete(() {
+        setState(() {
+          isRipple = false;
+        });
+      });
+    });
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    _moveController.dispose();
+    _expandController.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final screenSize = MediaQuery.of(context).size;
+
+    return Scaffold(
+      backgroundColor: AppColors.whiteColor,
+      body: Stack(
+        children: [
+          // Moving rotated ellipse
+
+          Lottie.asset(AppAnimations.splashLaunching, controller: _controller, onLoaded: (composition) {
+            _controller
+              ..duration = composition.duration
+              ..forward(); // Start the animation
+          }, repeat: false, reverse: false, frameRate: FrameRate(60), fit: BoxFit.fill)
+              .center,
+          Lottie.asset(AppAnimations.loadingAnimation, repeat: true, reverse: false, frameRate: FrameRate(60), width: 80.h, height: 80.h, fit: BoxFit.fill).center,
+
+          AnimatedContainer(
+            duration: Duration(milliseconds: 500),
+            width: screenSize.width,
+            height: screenSize.height,
+            color: isRipple ? AppColors.primaryRedColor : AppColors.whiteColor,
+          ),
+
+          AnimatedBuilder(
+            animation: _moveController,
+            builder: (context, child) {
+              final pos = _positionAnimation.value;
+              return Positioned(
+                left: ((screenSize.width * .75) * (pos.dx)).h,
+                top: ((screenSize.height * 0.75) * (pos.dy)).h,
+                child: Transform.rotate(
+                  angle: -120 * 3.1415927 / 150, // convert degrees to radians
+                  child: Container(
+                    width: 400.h,
+                    height: 653.h,
+                    decoration: BoxDecoration(
+                      color: Color(0xffED1C2B),
+                      borderRadius: BorderRadius.circular(330.h),
+                    ),
+                  ),
+                ),
+              );
+            },
+          ),
+          // Expanding white circle
+          AnimatedBuilder(
+            animation: _expandController,
+            builder: (context, child) {
+              return Center(
+                child: Transform.scale(
+                  scale: _expandAnimation.value,
+                  child: Opacity(
+                    opacity: 1.0, //- _expandAnimation.value.clamp(0.0, 1.0),
+                    child: Container(
+                        decoration: const BoxDecoration(
+                      color: Colors.white,
+                      shape: BoxShape.circle,
+                      // border: Border.fromBorderSide(BorderSide(
+                      //   width: 0,
+                      //   color: Color(0xffED1C2B),
+                      // )
+                    )),
+                  ),
+                  // ),
+                ),
+              );
+            },
+          ),
+          // AnimatedBuilder(
+          //   animation: _expandController,
+          //   builder: (context, child) {
+          //     final screenSize = MediaQuery.of(context).size;
+          //     final maxDiameter =
+          //         (screenSize.width > screenSize.height ? screenSize.width : screenSize.height) * 2;
+          //
+          //     return Center(
+          //       child: Transform.scale(
+          //         scale: _expandAnimation.value * maxDiameter / 100, // scale up to fill screen
+          //         child: Opacity(
+          //           opacity: (1.0 - _expandAnimation.value).clamp(0.0, 1.0),
+          //           child: Container(
+          //             decoration: const BoxDecoration(
+          //               color: Colors.white,
+          //               shape: BoxShape.circle,
+          //             ),
+          //           ),
+          //         ),
+          //       ),
+          //     );
+          //   },
+          // ),
+        ],
+      ),
+    );
+  }
+}
+
+class MoveObjectDemo extends StatefulWidget {
+  const MoveObjectDemo({super.key});
+
+  @override
+  State<MoveObjectDemo> createState() => _MoveObjectDemoState();
+}
+
+class _MoveObjectDemoState extends State<MoveObjectDemo> with SingleTickerProviderStateMixin {
+  late AnimationController _controller;
+  late Animation<Alignment> _alignmentAnimation;
+
+  @override
+  void initState() {
+    super.initState();
+
+    _controller = AnimationController(
+      vsync: this,
+      duration: const Duration(seconds: 1),
+    );
+
+    _alignmentAnimation = AlignmentTween(
+      begin: Alignment(-2.0, 2.5),
+      end: Alignment(2.5, -2),
+    ).animate(CurvedAnimation(parent: _controller, curve: Curves.easeInOut));
+
+    _controller.forward(); // start animation
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      body: AnimatedBuilder(
+        animation: _alignmentAnimation,
+        builder: (context, child) {
+          return Align(
+            alignment: _alignmentAnimation.value,
+            child: Transform.rotate(
+              angle: -120 * 3.1415927 / 180,
+              child: Container(
+                width: 200,
+                height: 375,
+                decoration: BoxDecoration(
+                  color: const Color(0xffED1C2B),
+                  borderRadius: BorderRadius.circular(330),
+                ),
+              ),
+            ),
+
+            // Transform.rotate(
+            //   angle: -120 * 3.1415927 / 180, // convert to radians
+            //   child: Container(
+            //     width: 400,
+            //     height: 653,
+            //     decoration: BoxDecoration(
+            //       color: const Color(0xffED1C2B),
+            //       borderRadius: BorderRadius.circular(330),
+            //     ),
+            //   ),
+            // ),
+          );
+        },
+      ),
+    );
+  }
+}
+
+class MoveOnClickDemo extends StatefulWidget {
+  const MoveOnClickDemo({super.key});
+
+  @override
+  State<MoveOnClickDemo> createState() => _MoveOnClickDemoState();
+}
+
+class _MoveOnClickDemoState extends State<MoveOnClickDemo> with TickerProviderStateMixin {
+  late AnimationController _controller;
+  late Animation<Alignment> _alignmentAnimation;
+
+  @override
+  void initState() {
+    super.initState();
+    init();
+  }
+
+  init() {
+    _controller = AnimationController(
+      vsync: this,
+      duration: const Duration(milliseconds: 1000), // Figma duration
+    );
+
+    _alignmentAnimation = AlignmentTween(
+      // begin: Alignment(-10.0, 5),
+      // end: Alignment(5, -2),
+      begin: Alignment.bottomLeft,
+      end: Alignment.topRight,
+    ).animate(CurvedAnimation(
+      parent: _controller,
+      curve: const Cubic(0.82, -0.01, 0.58, 1), // Figma cubic-bezier
+    ));
+    _animate();
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
+
+  void _animate() {
+    if (_controller.isCompleted) {
+      _controller.reverse();
+    } else {
+      _controller.forward();
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      body: GestureDetector(
+        onTap: _animate, // trigger on click
+        onDoubleTap: () {
+          _controller.dispose();
+          init();
+        },
+        child: AnimatedBuilder(
+          animation: _alignmentAnimation,
+          builder: (context, child) {
+            print(_alignmentAnimation.value);
+            return Align(
+              alignment: _alignmentAnimation.value,
+              child: Transform.rotate(
+                angle: -120 * 3.1415927 / 145, // -120 deg
+                child: Container(
+                  width: 100,
+                  height: 150,
+                  decoration: BoxDecoration(
+                    color: const Color(0xffED1C2B),
+                    borderRadius: BorderRadius.circular(330),
+                  ),
+                ),
+              ),
+            );
+          },
+        ),
+      ),
+    );
+  }
+}

lib/splashPage.dart

@@ -6,9 +6,13 @@ import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:flutter_zoom_videosdk/native/zoom_videosdk.dart';
+import 'package:hmg_patient_app_new/presentation/onboarding/onboarding_screen.dart';
+import 'package:hmg_patient_app_new/presentation/onboarding/splash_animation_screen.dart';
 import 'package:hmg_patient_app_new/core/api_consts.dart';
 import 'package:hmg_patient_app_new/core/app_assets.dart';
+import 'package:hmg_patient_app_new/core/app_export.dart';
 import 'package:hmg_patient_app_new/core/utils/utils.dart';
+import 'package:hmg_patient_app_new/extensions/widget_extensions.dart';
 import 'package:hmg_patient_app_new/features/authentication/authentication_view_model.dart';
 
 // import 'package:hmg_patient_app_new/presentation/authantication/login.dart';
@@ -16,6 +20,7 @@ import 'package:hmg_patient_app_new/presentation/home/landing_page.dart';
 import 'package:hmg_patient_app_new/presentation/home/navigation_screen.dart';
 import 'package:hmg_patient_app_new/theme/colors.dart';
 import 'package:hmg_patient_app_new/widgets/transitions/fade_page.dart';
+import 'package:lottie/lottie.dart';
 import 'package:provider/provider.dart';
 
 import 'core/cache_consts.dart';
@@ -31,6 +36,8 @@ class SplashPage extends StatefulWidget {
 class _SplashScreenState extends State<SplashPage> {
   late AuthenticationViewModel authVm;
 
+  bool isNewDesign = true;
+
   Future<void> initializeStuff() async {
     Timer(
       Duration(milliseconds: 500),
@@ -42,12 +49,17 @@ class _SplashScreenState extends State<SplashPage> {
     await authVm.getServicePrivilege();
     Timer(Duration(seconds: 2, milliseconds: 500), () async {
       LocalNotification.init(onNotificationClick: (payload) {});
-      Navigator.of(context).pushReplacement(
-        CustomPageRoute(
-          page: LandingNavigation(),
-          // page: LoginScreen(),
-        ),
-      );
+
+      if (isNewDesign) {
+        Navigator.of(context).pushReplacement(FadePage(page: SplashAnimationScreen(routeWidget: OnboardingScreen())));
+      } else {
+        Navigator.of(context).pushReplacement(
+          CustomPageRoute(
+            page: LandingNavigation(),
+            // page: LoginScreen(),
+          ),
+        );
+      }
     });
     var zoom = ZoomVideoSdk();
     InitConfig initConfig = InitConfig(
@@ -86,39 +98,41 @@ class _SplashScreenState extends State<SplashPage> {
   Widget build(BuildContext context) {
     return Scaffold(
       backgroundColor: AppColors.whiteColor,
-      body: Stack(
-        alignment: Alignment.center,
-        children: [
-          Padding(
-            padding: EdgeInsets.symmetric(horizontal: 53),
-            child: Image.asset(AppAssets.hmg_logo, fit: BoxFit.fitWidth, width: MediaQuery.of(context).size.width),
-          ),
-          Align(
-            alignment: Alignment.bottomCenter,
-            child: Column(
-              mainAxisSize: MainAxisSize.min,
+      body: isNewDesign
+          ? Lottie.asset(AppAnimations.loadingAnimation, repeat: true, reverse: false, frameRate: FrameRate(60), width: 80.h, height: 80.h, fit: BoxFit.fill).center
+          : Stack(
+              alignment: Alignment.center,
               children: [
-                Text(
-                  "Powered by",
-                  style: TextStyle(fontSize: 14, fontWeight: FontWeight.w400, color: AppColors.textColor, letterSpacing: -0.56, height: 16 / 14),
-                ),
-                SizedBox(
-                  height: 5,
+                Padding(
+                  padding: EdgeInsets.symmetric(horizontal: 53),
+                  child: Image.asset(AppAssets.hmg_logo, fit: BoxFit.fitWidth, width: MediaQuery.of(context).size.width),
                 ),
-                Utils.buildSvgWithAssets(icon: AppAssets.cloud_logo, width: 40, height: 40),
-                SizedBox(height: 7),
-                // Text(
-                //   "Version 1.1.0",
-                //   style: TextStyle(fontSize: 10, fontWeight: FontWeight.w400, color: Color(0xff3989898), letterSpacing: 0, height: 12 / 10),
-                // ),
-                SizedBox(
-                  height: 18,
+                Align(
+                  alignment: Alignment.bottomCenter,
+                  child: Column(
+                    mainAxisSize: MainAxisSize.min,
+                    children: [
+                      Text(
+                        "Powered by",
+                        style: TextStyle(fontSize: 14, fontWeight: FontWeight.w400, color: AppColors.textColor, letterSpacing: -0.56, height: 16 / 14),
+                      ),
+                      SizedBox(
+                        height: 5,
+                      ),
+                      Utils.buildSvgWithAssets(icon: AppAssets.cloud_logo, width: 40, height: 40),
+                      SizedBox(height: 7),
+                      // Text(
+                      //   "Version 1.1.0",
+                      //   style: TextStyle(fontSize: 10, fontWeight: FontWeight.w400, color: Color(0xff3989898), letterSpacing: 0, height: 12 / 10),
+                      // ),
+                      SizedBox(
+                        height: 18,
+                      )
+                    ],
+                  ),
                 )
               ],
             ),
-          )
-        ],
-      ),
     );
   }
 }

lib/widgets/buttons/custom_button.dart

@@ -20,7 +20,9 @@ class CustomButton extends StatelessWidget {
   final bool isDisabled;
   final Color? iconColor;
   final double height;
+  final double? width;
   final double iconSize;
+  final TextOverflow? textOverflow;
 
   CustomButton({
     Key? key,
@@ -39,7 +41,9 @@ class CustomButton extends StatelessWidget {
     this.icon,
     this.iconColor = Colors.white,
     this.height = 56,
+    this.width,
     this.iconSize = 24,
+    this.textOverflow,
   }) : super(key: key);
 
   @override
@@ -48,6 +52,7 @@ class CustomButton extends StatelessWidget {
         onTap: isDisabled ? null : onPressed,
         child: Container(
           height: height,
+          width: width,
           padding: padding,
           decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
               color: isDisabled ? Colors.transparent : backgroundColor,
@@ -69,6 +74,7 @@ class CustomButton extends StatelessWidget {
                 padding: EdgeInsets.only(top: 2.5),
                 child: Text(
                   text,
+                  overflow: textOverflow,
                   style: context.dynamicTextStyle(
                     fontSize: fontSize.fSize,
                     color: isDisabled ? textColor.withOpacity(0.5) : textColor,

lib/widgets/routes/custom_page_route.dart

@@ -2,14 +2,16 @@ import 'package:flutter/material.dart';
 import 'package:flutter/physics.dart';
 
 /// Reusable spring route
-class CustomPageRoute extends PageRouteBuilder {
+class CustomPageRoute<T> extends PageRouteBuilder<T> {
   final Widget page;
   final AxisDirection direction;
+  final bool fullScreenDialog;
 
-  CustomPageRoute({required this.page, this.direction = AxisDirection.right})
+  CustomPageRoute({required this.page, this.direction = AxisDirection.right, this.fullScreenDialog = false})
       : super(
           transitionDuration: const Duration(milliseconds: 1500),
           reverseTransitionDuration: const Duration(milliseconds: 500),
+          fullscreenDialog: fullScreenDialog,
           pageBuilder: (_, __, ___) => page,
           transitionsBuilder: (context, animation, secondaryAnimation, child) {
             final spring = SpringDescription(mass: 1, stiffness: 100, damping: 15);