feat: Navigate in image viewer with keyboard keys

lib/pages/image_viewer/image_viewer.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
 
 import 'package:matrix/matrix.dart';
 
@@ -26,6 +27,8 @@ class ImageViewer extends StatefulWidget {
 }
 
 class ImageViewerController extends State<ImageViewer> {
+  final FocusNode focusNode = FocusNode();
+
   @override
   void initState() {
     super.initState();
@@ -45,6 +48,17 @@ class ImageViewerController extends State<ImageViewer> {
 
   late final List<Event> allEvents;
 
+  void onKeyEvent(KeyEvent event) {
+    switch (event.logicalKey) {
+      case LogicalKeyboardKey.arrowLeft:
+        if (canGoBack) prevImage();
+        break;
+      case LogicalKeyboardKey.arrowRight:
+        if (canGoNext) nextImage();
+        break;
+    }
+  }
+
   void prevImage() async {
     await pageController.previousPage(
       duration: FluffyThemes.animationDuration,

lib/pages/image_viewer/image_viewer_view.dart

@@ -69,25 +69,29 @@ class ImageViewerView extends StatelessWidget {
         body: HoverBuilder(
           builder: (context, hovered) => Stack(
             children: [
-              PageView.builder(
+              KeyboardListener(
-                controller: controller.pageController,
+                focusNode: controller.focusNode,
-                itemCount: controller.allEvents.length,
+                onKeyEvent: controller.onKeyEvent,
-                itemBuilder: (context, i) => InteractiveViewer(
+                child: PageView.builder(
-                  minScale: 1.0,
+                  controller: controller.pageController,
-                  maxScale: 10.0,
+                  itemCount: controller.allEvents.length,
-                  onInteractionEnd: controller.onInteractionEnds,
+                  itemBuilder: (context, i) => InteractiveViewer(
-                  child: Center(
+                    minScale: 1.0,
-                    child: Hero(
+                    maxScale: 10.0,
-                      tag: controller.allEvents[i].eventId,
+                    onInteractionEnd: controller.onInteractionEnds,
-                      child: GestureDetector(
+                    child: Center(
-                        // Ignore taps to not go back here:
+                      child: Hero(
-                        onTap: () {},
+                        tag: controller.allEvents[i].eventId,
-                        child: MxcImage(
+                        child: GestureDetector(
-                          key: ValueKey(controller.allEvents[i].eventId),
+                          // Ignore taps to not go back here:
-                          event: controller.allEvents[i],
+                          onTap: () {},
-                          fit: BoxFit.contain,
+                          child: MxcImage(
-                          isThumbnail: false,
+                            key: ValueKey(controller.allEvents[i].eventId),
-                          animated: true,
+                            event: controller.allEvents[i],
+                            fit: BoxFit.contain,
+                            isThumbnail: false,
+                            animated: true,
+                          ),
                         ),
                       ),
                     ),