improve page loading

lib/sheet_viewer_page.dart

@@ -9,8 +9,11 @@ class SheetViewerPage extends StatefulWidget {
   final Sheet sheet;
   final ApiClient apiClient;
 
-  const SheetViewerPage(
-      {super.key, required this.sheet, required this.apiClient});
+  const SheetViewerPage({
+    super.key,
+    required this.sheet,
+    required this.apiClient,
+  });
 
   @override
   State<SheetViewerPage> createState() => _SheetViewerPageState();
@@ -21,11 +24,13 @@ class _SheetViewerPageState extends State<SheetViewerPage> {
   int page = 1;
   int numPages = 1;
   bool isFullscreen = false;
+  late Future<bool> documentLoaded;
   PdfDocument? document;
 
   @override
   void initState() {
     super.initState();
+    documentLoaded = loadPdf();
   }
 
   @override
@@ -34,15 +39,15 @@ class _SheetViewerPageState extends State<SheetViewerPage> {
     super.dispose();
   }
 
-  Future<PdfDocument> loadPdf() async {
+  Future<bool> loadPdf() async {
     var file = await widget.apiClient.getPdfFileCached(widget.sheet.uuid);
     if (file == null) {
       throw Exception("Failed fetching pdf file");
     }
 
-    var document = await PdfDocument.openFile(file.path);
+    document = await PdfDocument.openFile(file.path);
 
-    return document;
+    return true;
   }
 
   void toggleFullscreen() {
@@ -50,85 +55,98 @@ class _SheetViewerPageState extends State<SheetViewerPage> {
     if (isFullscreen) {
       log.info("enter fullscreen");
       // enter fullscreen
-      SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky,
-          overlays: []);
+      SystemChrome.setEnabledSystemUIMode(
+        SystemUiMode.immersiveSticky,
+        overlays: [],
+      );
     } else {
       // exit fullscreen
       log.info("exit fullscreen");
-      SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge,
-          overlays: SystemUiOverlay.values);
+      SystemChrome.setEnabledSystemUIMode(
+        SystemUiMode.edgeToEdge,
+        overlays: SystemUiOverlay.values,
+      );
     }
   }
 
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      appBar: AppBar(
-        title: Text(widget.sheet.name),
-      ),
+      appBar: AppBar(title: Text(widget.sheet.name)),
       body: FutureBuilder(
-          future: loadPdf(),
-          builder: (BuildContext context, AsyncSnapshot<PdfDocument> snapshot) {
-            if (snapshot.hasData) {
-              document = snapshot.data;
-              if (document != null) {
-                numPages = document!.pages.length;
-              }
-              return GestureDetector(
-                onTapUp: (TapUpDetails details) {
-                  // Get the size of the screen
-                  final screenWidth = MediaQuery.of(context).size.width;
+        future: documentLoaded,
+        builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
+          if (snapshot.hasData && document != null) {
+            numPages = document!.pages.length;
 
-                  // print("Touch at y = ${details.localPosition.dy}");
-                  // print("Touch at x = ${details.localPosition.dx}");
-                  // print("Screenwidth = ${screenWidth}");
-                  // Check where the user tapped
-                  // if (details.localPosition.dy < 100) {
-                  // TODO
-                  // setState(() {
-                  //   toggleFullscreen();
-                  // });
-                  if (details.localPosition.dx < screenWidth / 2) {
-                    // Left half of the screen
-                    setState(() {
-                      page = page > 1 ? page - 1 : 1;
-                    });
-                  } else {
-                    // Right half of the screen
-                    setState(() {
-                      page = page < numPages ? page + 1 : numPages;
-                    });
-                  }
-                },
-                child: Stack(
-                  children: [
-                    PdfPageView(
-                      key: ValueKey(page),
-                      document: document,
-                      pageNumber: page,
-                      alignment: Alignment.center,
-                    ),
-                    Container(
-                      alignment: Alignment.bottomCenter,
-                      padding: EdgeInsets.only(bottom: 5),
-                      child: Text('$page / $numPages'),
-                    ),
-                  ],
-                ),
-              );
-            } else if (snapshot.hasError) {
-              return Center(
-                  child: Text(
-                      style: Theme.of(context)
-                          .textTheme
-                          .displaySmall!
-                          .copyWith(color: Colors.red),
-                      textAlign: TextAlign.center,
-                      snapshot.error.toString()));
-            } else {
-              return const Center(child: CircularProgressIndicator());
-            }
-          }),
+            return GestureDetector(
+              onTapUp: (TapUpDetails details) {
+                // Get the size of the screen
+                final screenWidth = MediaQuery.of(context).size.width;
+
+                // print("Touch at y = ${details.localPosition.dy}");
+                // print("Touch at x = ${details.localPosition.dx}");
+                // print("Screenwidth = ${screenWidth}");
+                // Check where the user tapped
+                // if (details.localPosition.dy < 100) {
+                // TODO
+                // setState(() {
+                //   toggleFullscreen();
+                // });
+                if (details.localPosition.dx < screenWidth / 2) {
+                  // Left half of the screen
+                  setState(() {
+                    page = page > 1 ? page - 1 : 1;
+                  });
+                } else {
+                  // Right half of the screen
+                  setState(() {
+                    page = page < numPages ? page + 1 : numPages;
+                  });
+                }
+              },
+              child: Row(
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: [
+                  Stack(
+                    children: [
+                      PdfPageView(
+                        key: ValueKey(page),
+                        document: document,
+                        pageNumber: page,
+                        alignment: Alignment.center,
+                      ),
+                      Container(
+                        alignment: Alignment.bottomCenter,
+                        padding: EdgeInsets.only(bottom: 5),
+                        child: Text('$page / $numPages'),
+                      ),
+                    ],
+                  ),
+                  // PdfPageView(
+                  //   key: ValueKey(page),
+                  //   document: document,
+                  //   pageNumber: page + 1,
+                  //   alignment: Alignment.center,
+                  // ),
+                ],
+              ),
+            );
+          } else if (snapshot.hasError) {
+            return Center(
+              child: Text(
+                style: Theme.of(
+                  context,
+                ).textTheme.displaySmall!.copyWith(color: Colors.red),
+                textAlign: TextAlign.center,
+                snapshot.error.toString(),
+              ),
+            );
+          } else {
+            return const Center(child: CircularProgressIndicator());
+          }
+        },
+      ),
     );
   }
 }