added overlay disappear after a short time

lib/models/timeline_overlay.dart

@@ -0,0 +1,15 @@
+import 'package:flutter/material.dart';
+
+class TimelineOverlay extends ChangeNotifier {
+  bool _showOverlay = true;
+
+  bool get showOverlay => _showOverlay;
+
+  void hideOverlay() => setShowOverlay(false);
+  void restoreOverlay() => setShowOverlay(true);
+
+  void setShowOverlay(bool showOverlay) {
+    _showOverlay = showOverlay;
+    notifyListeners();
+  }
+}

lib/widgets/memory_slide.dart

@@ -1,8 +1,10 @@
 import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
 import 'package:share_location/controllers/memory_slide_controller.dart';
 import 'package:share_location/controllers/status_controller.dart';
 import 'package:share_location/enums.dart';
 import 'package:share_location/foreign_types/memory.dart';
+import 'package:share_location/models/timeline_overlay.dart';
 import 'package:share_location/widgets/status.dart';
 
 import 'memory.dart';
@@ -66,8 +68,10 @@ class _MemorySlideState extends State<MemorySlide>
 
   @override
   Widget build(BuildContext context) {
-    return Status(
+    return Consumer<TimelineOverlay>(
+      builder: (context, overlayController, _) => Status(
         controller: controller,
+        disabled: !overlayController.showOverlay,
         child: MemoryView(
           creationDate: widget.memory.creationDate,
           location: widget.memory.location,
@@ -96,6 +100,7 @@ class _MemorySlideState extends State<MemorySlide>
             }
           },
         ),
+      ),
     );
   }
 }

lib/widgets/status.dart

@@ -7,10 +7,12 @@ const BAR_HEIGHT = 4.0;
 class Status extends StatefulWidget {
   final StatusController? controller;
   final Widget child;
+  final bool disabled;
 
   const Status({
     Key? key,
     required this.child,
+    this.disabled = false,
     this.controller,
   }) : super(key: key);
 
@@ -29,6 +31,12 @@ class _StatusState extends State<Status> with TickerProviderStateMixin {
     if (widget.controller != null && animationController == null) {
       initializeAnimation();
     }
+
+    if (widget.disabled) {
+      animationController?.stop();
+    } else {
+      animationController?.forward();
+    }
   }
 
   @override
@@ -75,6 +83,10 @@ class _StatusState extends State<Status> with TickerProviderStateMixin {
           height: BAR_HEIGHT,
           child: Padding(
             padding: const EdgeInsets.symmetric(horizontal: SMALL_SPACE),
+            child: AnimatedOpacity(
+              duration: const Duration(milliseconds: 500),
+              curve: Curves.linearToEaseOut,
+              opacity: widget.disabled ? 0.0 : 1.0,
               child: (widget.controller == null)
                   ? ClipRRect(
                       borderRadius: BorderRadius.circular(HUGE_SPACE),
@@ -99,6 +111,7 @@ class _StatusState extends State<Status> with TickerProviderStateMixin {
                     ),
             ),
           ),
+        ),
       ],
     );
   }

lib/widgets/timeline_page.dart

@@ -1,8 +1,12 @@
+import 'dart:async';
+
 import 'package:flutter/material.dart';
 import 'package:intl/intl.dart';
+import 'package:provider/provider.dart';
 import 'package:share_location/constants/spacing.dart';
 import 'package:share_location/controllers/memory_slide_controller.dart';
 import 'package:share_location/foreign_types/memory.dart';
+import 'package:share_location/models/timeline_overlay.dart';
 import 'package:share_location/widgets/memory_slide.dart';
 
 class TimelinePage extends StatefulWidget {
@@ -24,9 +28,12 @@ class TimelinePage extends StatefulWidget {
 }
 
 class _TimelinePageState extends State<TimelinePage> {
+  final timelineOverlayController = TimelineOverlay();
   final pageController = PageController();
   late final MemorySlideController controller;
 
+  Timer? overlayRemover;
+
   @override
   void initState() {
     super.initState();
@@ -52,6 +59,7 @@ class _TimelinePageState extends State<TimelinePage> {
   @override
   void dispose() {
     controller.dispose();
+    timelineOverlayController.dispose();
 
     super.dispose();
   }
@@ -61,11 +69,23 @@ class _TimelinePageState extends State<TimelinePage> {
     return GestureDetector(
       onTapDown: (_) {
         controller.setPaused(true);
+
+        overlayRemover = Timer(
+          const Duration(milliseconds: 200),
+          timelineOverlayController.hideOverlay,
+        );
       },
       onTapUp: (_) {
+        overlayRemover?.cancel();
+
         controller.setPaused(false);
+
+        timelineOverlayController.restoreOverlay();
       },
       onTapCancel: () {
+        overlayRemover?.cancel();
+
+        timelineOverlayController.restoreOverlay();
         controller.setPaused(false);
       },
       onHorizontalDragEnd: (details) {
@@ -85,6 +105,8 @@ class _TimelinePageState extends State<TimelinePage> {
           );
         }
       },
+      child: ChangeNotifierProvider<TimelineOverlay>(
+        create: (_) => timelineOverlayController,
         child: Stack(
           fit: StackFit.expand,
           children: <Widget>[
@@ -101,15 +123,26 @@ class _TimelinePageState extends State<TimelinePage> {
             ),
             Padding(
               padding: const EdgeInsets.only(
-                top: LARGE_SPACE, left: MEDIUM_SPACE, right: MEDIUM_SPACE),
+                top: LARGE_SPACE,
+                left: MEDIUM_SPACE,
+                right: MEDIUM_SPACE,
+              ),
+              child: Consumer<TimelineOverlay>(
+                builder: (context, overlayController, _) => AnimatedOpacity(
+                  duration: const Duration(milliseconds: 500),
+                  curve: Curves.linearToEaseOut,
+                  opacity: overlayController.showOverlay ? 1.0 : 0.0,
                   child: Text(
                     DateFormat('dd. MMMM yyyy').format(widget.date),
                     textAlign: TextAlign.center,
                     style: Theme.of(context).textTheme.headline1,
                   ),
                 ),
+              ),
+            ),
           ],
         ),
+      ),
     );
   }
 }

pubspec.lock

@@ -310,6 +310,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.0.2"
+  nested:
+    dependency: transitive
+    description:
+      name: nested
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "1.0.0"
   path:
     dependency: "direct main"
     description:
@@ -457,6 +464,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "0.3.0"
+  provider:
+    dependency: "direct main"
+    description:
+      name: provider
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "6.0.3"
   quiver:
     dependency: transitive
     description:

pubspec.yaml

@@ -45,6 +45,7 @@ dependencies:
   intl: ^0.17.0
   property_change_notifier: ^0.3.0
   path: ^1.8.1
+  provider: ^6.0.3
 
 dev_dependencies:
   flutter_test: