added calendar animation

lib/main.dart

@@ -46,31 +46,32 @@ class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
-        title: 'Flutter Demo',
+      title: 'Flutter Demo',
-        theme: ThemeData.dark().copyWith(
+      theme: ThemeData.dark().copyWith(
-          textTheme: ThemeData.dark().textTheme.copyWith(
+        textTheme: ThemeData.dark().textTheme.copyWith(
-                headline1: const TextStyle(
+              headline1: const TextStyle(
-                  fontSize: 32,
+                fontSize: 32,
-                  fontWeight: FontWeight.w500,
+                fontWeight: FontWeight.w500,
-                ),
               ),
-          inputDecorationTheme: InputDecorationTheme(
-            filled: true,
-            helperMaxLines: 10,
-            errorMaxLines: 10,
-            border: OutlineInputBorder(
-              borderRadius: BorderRadius.circular(8),
             ),
+        inputDecorationTheme: InputDecorationTheme(
+          filled: true,
+          helperMaxLines: 10,
+          errorMaxLines: 10,
+          border: OutlineInputBorder(
+            borderRadius: BorderRadius.circular(8),
           ),
         ),
-        routes: {
+      ),
-          WelcomeScreen.ID: (context) => const WelcomeScreen(),
+      routes: {
-          MainScreen.ID: (context) => const MainScreen(),
+        WelcomeScreen.ID: (context) => const WelcomeScreen(),
-          LoginScreen.ID: (context) => const LoginScreen(),
+        MainScreen.ID: (context) => const MainScreen(),
-          TimelineScreen.ID: (context) => const TimelineScreen(),
+        LoginScreen.ID: (context) => const LoginScreen(),
-          GrantPermissionScreen.ID: (context) => const GrantPermissionScreen(),
+        TimelineScreen.ID: (context) => const TimelineScreen(),
-          CalendarScreen.ID: (context) => const CalendarScreen(),
+        GrantPermissionScreen.ID: (context) => const GrantPermissionScreen(),
-        },
+        CalendarScreen.ID: (context) => const CalendarScreen(),
-        initialRoute: CalendarScreen.ID);
+      },
+      initialRoute: initialPage,
+    );
   }
 }

lib/screens/calendar_screen.dart

@@ -47,7 +47,11 @@ class _CalendarScreenState extends State<CalendarScreen> {
   @override
   Widget build(BuildContext context) {
     if (calendar.isInitializing) {
-      return CircularProgressIndicator();
+      return const Scaffold(
+        body: Center(
+          child: CircularProgressIndicator(),
+        ),
+      );
     }
 
     final theme = Theme.of(context);

lib/screens/timeline_screen.dart

@@ -6,6 +6,8 @@ import 'package:share_location/utils/loadable.dart';
 import 'package:share_location/widgets/timeline_page.dart';
 import 'package:supabase_flutter/supabase_flutter.dart';
 
+import 'calendar_screen.dart';
+
 final supabase = Supabase.instance.client;
 
 class TimelineScreen extends StatefulWidget {
@@ -95,28 +97,35 @@ class _TimelineScreenState extends State<TimelineScreen> with Loadable {
       );
     }
 
-    return Scaffold(
+    return WillPopScope(
-      body: ChangeNotifierProvider.value(
+      onWillPop: () async {
-        value: timeline,
+        await Navigator.pushNamed(context, CalendarScreen.ID);
-        child: PageView.builder(
-          controller: pageController,
-          scrollDirection: Axis.vertical,
-          itemCount: timeline.values.length,
-          onPageChanged: (newPage) {
-            if (_ignorePageChanges) {
-              return;
-            }
 
-            if (timeline.currentIndex != newPage) {
+        return true;
-              // User manually changed page
+      },
-              timeline.setCurrentIndex(newPage);
+      child: Scaffold(
+        body: ChangeNotifierProvider.value(
+          value: timeline,
+          child: PageView.builder(
+            controller: pageController,
+            scrollDirection: Axis.vertical,
+            itemCount: timeline.values.length,
+            onPageChanged: (newPage) {
+              if (_ignorePageChanges) {
+                return;
+              }
 
-              timeline.setMemoryIndex(0);
+              if (timeline.currentIndex != newPage) {
-            }
+                // User manually changed page
-          },
+                timeline.setCurrentIndex(newPage);
-          itemBuilder: (_, index) => TimelinePage(
+
-            date: timeline.dateAtIndex(index),
+                timeline.setMemoryIndex(0);
-            memoryPack: timeline.atIndex(index),
+              }
+            },
+            itemBuilder: (_, index) => TimelinePage(
+              date: timeline.dateAtIndex(index),
+              memoryPack: timeline.atIndex(index),
+            ),
           ),
         ),
       ),

lib/widgets/calendar_month.dart

@@ -5,6 +5,8 @@ import 'package:flutter_calendar_widget/flutter_calendar_widget.dart';
 import 'package:intl/intl.dart';
 import 'package:share_location/constants/spacing.dart';
 import 'package:share_location/screens/timeline_screen.dart';
+import 'package:share_location/widgets/delay_render.dart';
+import 'package:share_location/widgets/fade_and_move_in_animation.dart';
 
 class MonthCalendarBuilder extends CalendarBuilder {
   @override
@@ -35,43 +37,50 @@ class MonthCalendarBuilder extends CalendarBuilder {
       return amount / highestAmountOfEvents;
     }();
 
-    return Opacity(
+    final duration = Duration(milliseconds: Random().nextInt(800));
-      opacity: () {
-        if (type.isOutSide) {
-          return 0.0;
-        }
 
-        if (dateTime.isAfter(DateTime.now())) {
+    return DelayRender(
-          return 0.4;
+      delay: duration,
-        }
+      child: FadeAndMoveInAnimation(
+        child: Opacity(
+          opacity: () {
+            if (type.isOutSide) {
+              return 0.0;
+            }
 
-        return 1.0;
+            if (dateTime.isAfter(DateTime.now())) {
-      }(),
+              return 0.4;
-      child: Padding(
+            }
-        padding: const EdgeInsets.all(TINY_SPACE),
+
-        child: ClipRRect(
+            return 1.0;
-          borderRadius: BorderRadius.circular(SMALL_SPACE),
+          }(),
-          child: Stack(
+          child: Padding(
-            alignment: style.dayAlignment,
+            padding: const EdgeInsets.all(TINY_SPACE),
-            children: [
+            child: ClipRRect(
-              SizedBox(
+              borderRadius: BorderRadius.circular(SMALL_SPACE),
-                child: Container(
+              child: Stack(
-                  color: textStyle.selectedDayTextColor
+                alignment: style.dayAlignment,
-                      .withOpacity(backgroundPercentage),
+                children: [
-                ),
+                  SizedBox(
-              ),
+                    child: Container(
-              Container(
+                      color: textStyle.selectedDayTextColor
-                alignment: Alignment.center,
+                          .withOpacity(backgroundPercentage),
-                child: Text(
+                    ),
-                  dateTime.day.toString(),
-                  style: TextStyle(
-                    color: backgroundPercentage > .5
-                        ? textStyle.focusedDayTextColor
-                        : textStyle.dayTextColor,
                   ),
-                ),
+                  Container(
+                    alignment: Alignment.center,
+                    child: Text(
+                      dateTime.day.toString(),
+                      style: TextStyle(
+                        color: backgroundPercentage > .5
+                            ? textStyle.focusedDayTextColor
+                            : textStyle.dayTextColor,
+                      ),
+                    ),
+                  ),
+                ],
               ),
-            ],
+            ),
           ),
         ),
       ),