Improve console scroll

README.md

@@ -8,10 +8,8 @@ Make sure you have **Java 16** or higher installed and on your PATH!
 
 ## TODO
 - make the console better
-  - fix the scroll; when you scroll up, new logs should not move the view (but it does, rn)
   - add a scroll down button (only visible if you scroll up)
-  - make the output global state (so it doesn't clear when you switch tabs)
-    - add a clear output button? (do i really want to allow users to clear the output?)
+  - add a clear output button? (do i really want to allow users to clear the output?)
 - make it not lose the process (orphan) as easily
 	- when closing the program, it loses it
 - config editor: horizontal scroll bar

lib/console.dart

@@ -1,3 +1,4 @@
+import "package:animated_visibility/animated_visibility.dart";
 import "package:flutter/material.dart";
 import "package:flutter_riverpod/flutter_riverpod.dart";
 
@@ -35,14 +36,20 @@ class ConsoleState extends ConsumerState<Console> {
   final ScrollController _scrollController = ScrollController();
   Color colour = Colors.white;
 
+  bool get isScrolledToBottom =>
+      _scrollController.hasClients &&
+      _scrollController.position.pixels == _scrollController.position.maxScrollExtent;
+
   @override
   Widget build(BuildContext context) {
     //scroll down when new output is added
     ref.listen(outputNotifierProvider, (previous, next) {
-      //wait a frame, to make sure the text is built before scrolling to the end
-      WidgetsBinding.instance.addPostFrameCallback((_) {
-        _scrollController.jumpTo(_scrollController.position.maxScrollExtent);
-      });
+      if (isScrolledToBottom) {
+        //wait a frame, to make sure the text is built before scrolling to the end
+        WidgetsBinding.instance.addPostFrameCallback((_) {
+          _scrollController.jumpTo(_scrollController.position.maxScrollExtent);
+        });
+      }
     });
 
     //rebuild when new output is added
@@ -55,23 +62,53 @@ class ConsoleState extends ConsumerState<Console> {
         color: Colors.black,
         borderRadius: BorderRadius.all(Radius.circular(8)),
       ),
-      child: DefaultTextStyle(
-        style: pixelCode,
-        child: ListView.builder(
-          controller: _scrollController,
-          itemBuilder: (context, index) {
-            String message = output[index];
-            if (message.contains("ERR")) {
-              colour = Colors.red;
-            } else if (message.contains("WARN")) {
-              colour = Colors.yellow;
-            } else if (message.contains("INFO")) {
-              colour = Colors.white;
-            }
-            return Text(message, style: TextStyle(color: colour));
-          },
-          itemCount: output.length,
-        ),
+      child: Stack(
+        children: [
+          DefaultTextStyle(
+            style: pixelCode,
+            child: ListView.builder(
+              controller: _scrollController,
+              itemBuilder: (context, index) {
+                String message = output[index];
+                if (message.contains("ERR")) {
+                  colour = Colors.red;
+                } else if (message.contains("WARN")) {
+                  colour = Colors.yellow;
+                } else if (message.contains("INFO")) {
+                  colour = Colors.white;
+                }
+                return Text(message, style: TextStyle(color: colour));
+              },
+              itemCount: output.length,
+            ),
+          ),
+          Align(
+            alignment: Alignment.bottomRight,
+            child: AnimatedVisibility(
+              //TODO: this only happens on rebuild, which means it doesn't actually update when you scroll to or from the bottom
+              visible: !isScrolledToBottom,
+              enter: fadeIn() + scaleIn(),
+              enterDuration: Durations.medium1,
+              exit: fadeOut() + scaleOut(),
+              exitDuration: Durations.medium1,
+              child: FloatingActionButton(
+                  child: const Icon(Icons.arrow_downward),
+                  onPressed: () {
+                    _scrollController
+                        .animateTo(
+                      _scrollController.position.maxScrollExtent,
+                      duration: Durations.medium4,
+                      curve: Curves.easeInOut,
+                    )
+                        .then((_) {
+                      _scrollController.jumpTo(_scrollController.position
+                          .maxScrollExtent); //TODO: remove the need for this. get animateTo to work properly and scroll fully down, instead.
+                      setState(() {/*this is a hack to make the button disappear*/});
+                    });
+                  }),
+            ),
+          ),
+        ],
       ),
     );
   }

pubspec.lock

@@ -30,6 +30,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "0.11.3"
+  animated_visibility:
+    dependency: "direct main"
+    description:
+      name: animated_visibility
+      sha256: f68b65a78ef1fbe6b9d665d5a6399d1c859fcd0755eaa648345d1224eea9b342
+      url: "https://pub.dev"
+    source: hosted
+    version: "0.0.4"
   args:
     dependency: transitive
     description:
@@ -251,14 +259,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "4.0.0"
-  flutter_list_view:
-    dependency: "direct main"
-    description:
-      name: flutter_list_view
-      sha256: d99dc310bb3ca9d688dae1585b38a3f56e7b06eeb085ae27a5e0f56cf52172c5
-      url: "https://pub.dev"
-    source: hosted
-    version: "1.1.28"
   flutter_plugin_android_lifecycle:
     dependency: transitive
     description:

pubspec.yaml

@@ -28,13 +28,13 @@ environment:
 # the latest version available on pub.dev. To see which dependencies have newer
 # versions available, run `flutter pub outdated`.
 dependencies:
+  animated_visibility: ^0.0.4
   async: ^2.11.0
   crypto: ^3.0.5
   file_picker: ^8.1.2
   flutter:
     sdk: flutter
   flutter_code_editor: ^0.3.2
-  flutter_list_view: ^1.1.28
   flutter_riverpod: ^2.5.1
   path: ^1.9.0
   rxdart: ^0.28.0