From 197c5c292aed10515a3ff94f2d01f7e8470cee24 Mon Sep 17 00:00:00 2001 From: yaso-meth Date: Wed, 21 Aug 2024 12:41:29 +0200 Subject: [PATCH] Full Screen new page file viewer --- .../components/builders/BuildFileView.dart | 199 ++---------- .../lib/objects/arguments.dart | 10 + .../lib/pages/fullScreenFile.dart | 304 ++++++++++++++++++ .../lib/router/routeGenerator.dart | 11 + 4 files changed, 347 insertions(+), 177 deletions(-) create mode 100644 Frontend/patient_manager/lib/pages/fullScreenFile.dart diff --git a/Frontend/patient_manager/lib/components/builders/BuildFileView.dart b/Frontend/patient_manager/lib/components/builders/BuildFileView.dart index cd24988e..266046f0 100644 --- a/Frontend/patient_manager/lib/components/builders/BuildFileView.dart +++ b/Frontend/patient_manager/lib/components/builders/BuildFileView.dart @@ -1,8 +1,8 @@ import 'package:flutter/material.dart'; import 'package:patient_manager/main.dart'; +import 'package:patient_manager/objects/arguments.dart'; import 'package:syncfusion_flutter_core/theme.dart'; import 'package:syncfusion_flutter_pdfviewer/pdfviewer.dart'; -import "package:universal_html/html.dart" as html; class BuildFileView extends StatefulWidget { final String link; @@ -19,174 +19,8 @@ class BuildFileView extends StatefulWidget { class _BuildFileViewState extends State { late PdfViewerController pdfViewerController = PdfViewerController(); - - void expandFile(double width, double height) { - showDialog( - context: context, - builder: (context) { - return Stack( - children: [ - Container( - padding: const EdgeInsets.only(top: 20.0), - width: width, - height: height, - decoration: BoxDecoration( - color: MzanziInnovationHub.of(context)!.theme.primaryColor(), - //borderRadius: BorderRadius.circular(25.0), - // border: Border.all( - // color: MzanziInnovationHub.of(context)!.theme.errorColor(), - // width: 5.0), - ), - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - Center( - child: Text( - getFileName(widget.path), - style: const TextStyle( - fontSize: 15, - fontWeight: FontWeight.bold, - ), - ), - ), - const SizedBox(height: 20), - Expanded( - child: SfPdfViewerTheme( - data: SfPdfViewerThemeData( - backgroundColor: MzanziInnovationHub.of(context)! - .theme - .primaryColor(), - ), - child: SfPdfViewer.network( - widget.link, - controller: pdfViewerController, - ), - ), - ), - ], - ), - ), - Positioned( - top: 5, - left: 2, - width: 50, - height: 50, - child: IconButton.filled( - onPressed: () { - Navigator.pop(context); - }, - icon: Icon( - Icons.fullscreen_exit, - color: MzanziInnovationHub.of(context)!.theme.primaryColor(), - size: 35, - ), - ), - ), - Positioned( - top: 5, - right: 2, - width: 50, - height: 50, - child: IconButton.filled( - onPressed: () { - html.window.open( - widget.link, - // '${AppEnviroment.baseFileUrl}/mih/$filePath', - 'download'); - }, - icon: Icon( - Icons.download, - color: MzanziInnovationHub.of(context)!.theme.primaryColor(), - size: 35, - ), - ), - ), - ], - ); - }, - ); - } - - void expandImage(double width, double height) { - showDialog( - context: context, - builder: (context) { - return Stack( - children: [ - Container( - padding: const EdgeInsets.only(top: 20.0), - width: width, - height: height, - decoration: BoxDecoration( - color: MzanziInnovationHub.of(context)!.theme.primaryColor(), - //borderRadius: BorderRadius.circular(25.0), - // border: Border.all( - // color: MzanziInnovationHub.of(context)!.theme.errorColor(), - // width: 5.0), - ), - child: Column( - mainAxisSize: MainAxisSize.min, - children: [ - Center( - child: Text( - getFileName(widget.path), - style: const TextStyle( - fontSize: 15, - fontWeight: FontWeight.bold, - ), - ), - ), - const SizedBox(height: 20), - Expanded( - child: InteractiveViewer( - maxScale: 5.0, - //minScale: 0., - child: Image.network(widget.link), - ), - ), - ], - ), - ), - Positioned( - top: 5, - left: 2, - width: 50, - height: 50, - child: IconButton.filled( - onPressed: () { - Navigator.pop(context); - }, - icon: Icon( - Icons.fullscreen_exit, - color: MzanziInnovationHub.of(context)!.theme.primaryColor(), - size: 35, - ), - ), - ), - Positioned( - top: 5, - right: 2, - width: 50, - height: 50, - child: IconButton.filled( - onPressed: () { - html.window.open( - widget.link, - // '${AppEnviroment.baseFileUrl}/mih/$filePath', - 'download'); - }, - icon: Icon( - Icons.download, - color: MzanziInnovationHub.of(context)!.theme.primaryColor(), - size: 35, - ), - ), - ), - ], - ); - }, - ); - } + //late TextEditingController currentPageController = TextEditingController(); + double startZoomLevel = 1; String getExtType(String path) { //print(pdfLink.split(".")[1]); @@ -200,8 +34,8 @@ class _BuildFileViewState extends State { @override Widget build(BuildContext context) { - double width = MediaQuery.sizeOf(context).width; - double height = MediaQuery.sizeOf(context).height; + // double width = MediaQuery.sizeOf(context).width; + // double height = MediaQuery.sizeOf(context).height; if (getExtType(widget.path).toLowerCase() == "pdf") { //print(widget.pdfLink); return Stack( @@ -224,13 +58,18 @@ class _BuildFileViewState extends State { ), Positioned( top: 5, - right: 5, + left: 5, width: 50, height: 50, child: IconButton.filled( onPressed: () { - expandFile(width, height); - //Navigator.pop(context); + Navigator.of(context).pushNamed( + '/file-veiwer', + arguments: FileViewArguments( + widget.link, + widget.path, + ), + ); }, icon: Icon( Icons.fullscreen, @@ -257,13 +96,19 @@ class _BuildFileViewState extends State { ), Positioned( top: 5, - right: 5, + left: 5, width: 50, height: 50, child: IconButton.filled( onPressed: () { - expandImage(width, height); - //Navigator.pop(context); + //expandImage(width, height); + Navigator.of(context).pushNamed( + '/file-veiwer', + arguments: FileViewArguments( + widget.link, + widget.path, + ), + ); }, icon: Icon( Icons.fullscreen, diff --git a/Frontend/patient_manager/lib/objects/arguments.dart b/Frontend/patient_manager/lib/objects/arguments.dart index f4e8463f..43330758 100644 --- a/Frontend/patient_manager/lib/objects/arguments.dart +++ b/Frontend/patient_manager/lib/objects/arguments.dart @@ -15,6 +15,16 @@ class BusinessArguments { ); } +class FileViewArguments { + final String link; + final String path; + + FileViewArguments( + this.link, + this.path, + ); +} + class PatientViewArguments { final AppUser signedInUser; final Patient? selectedPatient; diff --git a/Frontend/patient_manager/lib/pages/fullScreenFile.dart b/Frontend/patient_manager/lib/pages/fullScreenFile.dart new file mode 100644 index 00000000..917045cc --- /dev/null +++ b/Frontend/patient_manager/lib/pages/fullScreenFile.dart @@ -0,0 +1,304 @@ +import 'package:flutter/material.dart'; +import 'package:patient_manager/main.dart'; +import 'package:patient_manager/objects/arguments.dart'; +import 'package:syncfusion_flutter_core/theme.dart'; +import 'package:syncfusion_flutter_pdfviewer/pdfviewer.dart'; +import "package:universal_html/html.dart" as html; + +class FullScreenFileViewer extends StatefulWidget { + final FileViewArguments arguments; + const FullScreenFileViewer({ + super.key, + required this.arguments, + }); + + @override + State createState() => _FullScreenFileViewerState(); +} + +class _FullScreenFileViewerState extends State { + late PdfViewerController pdfViewerController = PdfViewerController(); + int currentPageCount = 0; + int currentPage = 0; + double startZoomLevel = 1.0; + + String getExtType(String path) { + //print(pdfLink.split(".")[1]); + return path.split(".").last; + } + + String getFileName(String path) { + //print(pdfLink.split(".")[1]); + return path.split("/").last; + } + + void onPageSelect() { + setState(() { + currentPage = pdfViewerController.pageNumber; + }); + } + + @override + void initState() { + pdfViewerController.addListener(onPageSelect); + super.initState(); + } + + @override + Widget build(BuildContext context) { + if (getExtType(widget.arguments.path).toLowerCase() == "pdf") { + return Scaffold( + body: Stack( + children: [ + Container( + padding: const EdgeInsets.only(top: 20.0), + decoration: BoxDecoration( + color: MzanziInnovationHub.of(context)!.theme.primaryColor(), + ), + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + Center( + child: Text( + getFileName(widget.arguments.path), + style: const TextStyle( + fontSize: 15, + fontWeight: FontWeight.bold, + ), + ), + ), + const SizedBox(height: 20), + Expanded( + child: SfPdfViewerTheme( + data: SfPdfViewerThemeData( + backgroundColor: MzanziInnovationHub.of(context)! + .theme + .primaryColor(), + ), + child: SfPdfViewer.network( + widget.arguments.link, + controller: pdfViewerController, + initialZoomLevel: startZoomLevel, + pageSpacing: 2, + maxZoomLevel: 5, + interactionMode: PdfInteractionMode.pan, + onDocumentLoaded: (details) { + setState(() { + currentPage = pdfViewerController.pageNumber; + currentPageCount = pdfViewerController.pageCount; + }); + }, + ), + ), + ), + ], + ), + ), + Positioned( + top: 5, + left: 2, + width: 50, + height: 50, + child: IconButton( + onPressed: () { + Navigator.pop(context); + }, + icon: Icon( + Icons.fullscreen_exit, + color: + MzanziInnovationHub.of(context)!.theme.secondaryColor(), + size: 35, + ), + ), + ), + Positioned( + top: 5, + right: 2, + //width: 50, + height: 50, + child: Row( + mainAxisSize: MainAxisSize.min, + mainAxisAlignment: MainAxisAlignment.end, + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + IconButton( + onPressed: () { + pdfViewerController.previousPage(); + //print(pdfViewerController.); + //if (pdfViewerController.pageNumber > 1) { + setState(() { + currentPage = pdfViewerController.pageNumber; + }); + // } + }, + icon: Icon( + Icons.arrow_back, + color: MzanziInnovationHub.of(context)! + .theme + .secondaryColor(), + size: 35, + ), + ), + // SizedBox( + // width: 40, + // height: 40, + // child: MIHTextField( + // controller: cuntrController, + // hintText: "", + // editable: true, + // required: false), + // ), + Text( + "$currentPage / $currentPageCount", + style: const TextStyle(fontSize: 20), + ), + IconButton( + onPressed: () { + pdfViewerController.nextPage(); + //print(pdfViewerController.pageNumber); + //if (pdfViewerController.pageNumber < currentPageCount) { + setState(() { + currentPage = pdfViewerController.pageNumber; + }); + //} + }, + icon: Icon( + Icons.arrow_forward, + color: MzanziInnovationHub.of(context)! + .theme + .secondaryColor(), + size: 35, + ), + ), + IconButton( + onPressed: () { + setState(() { + pdfViewerController.zoomLevel = startZoomLevel + 0.25; + startZoomLevel = pdfViewerController.zoomLevel; + }); + }, + icon: Icon( + Icons.zoom_in, + color: MzanziInnovationHub.of(context)! + .theme + .secondaryColor(), + size: 35, + ), + ), + IconButton( + onPressed: () { + setState(() { + pdfViewerController.zoomLevel = startZoomLevel - 0.25; + startZoomLevel = pdfViewerController.zoomLevel; + }); + }, + icon: Icon( + Icons.zoom_out, + color: MzanziInnovationHub.of(context)! + .theme + .secondaryColor(), + size: 35, + ), + ), + IconButton( + onPressed: () { + html.window.open( + widget.arguments.link, + // '${AppEnviroment.baseFileUrl}/mih/$filePath', + 'download'); + }, + icon: Icon( + Icons.download, + color: MzanziInnovationHub.of(context)! + .theme + .secondaryColor(), + size: 35, + ), + ), + ], + ), + ), + ], + ), + ); + } else { + return Scaffold( + body: Stack( + children: [ + Container( + padding: const EdgeInsets.only(top: 20.0), + // width: width, + // height: height, + decoration: BoxDecoration( + color: MzanziInnovationHub.of(context)!.theme.primaryColor(), + //borderRadius: BorderRadius.circular(25.0), + // border: Border.all( + // color: MzanziInnovationHub.of(context)!.theme.errorColor(), + // width: 5.0), + ), + child: Column( + mainAxisSize: MainAxisSize.max, + children: [ + Center( + child: Text( + getFileName(widget.arguments.path), + style: const TextStyle( + fontSize: 15, + fontWeight: FontWeight.bold, + ), + ), + ), + const SizedBox(height: 20), + Expanded( + child: InteractiveViewer( + maxScale: 5.0, + //minScale: 0., + child: Image.network(widget.arguments.link), + ), + ), + ], + ), + ), + Positioned( + top: 5, + left: 2, + width: 50, + height: 50, + child: IconButton( + onPressed: () { + Navigator.pop(context); + }, + icon: Icon( + Icons.fullscreen_exit, + color: + MzanziInnovationHub.of(context)!.theme.secondaryColor(), + size: 35, + ), + ), + ), + Positioned( + top: 5, + right: 2, + width: 50, + height: 50, + child: IconButton( + onPressed: () { + html.window.open( + widget.arguments.link, + // '${AppEnviroment.baseFileUrl}/mih/$filePath', + 'download'); + }, + icon: Icon( + Icons.download, + color: + MzanziInnovationHub.of(context)!.theme.secondaryColor(), + size: 35, + ), + ), + ), + ], + ), + ); + } + } +} diff --git a/Frontend/patient_manager/lib/router/routeGenerator.dart b/Frontend/patient_manager/lib/router/routeGenerator.dart index 91af93cf..f85a8a3b 100644 --- a/Frontend/patient_manager/lib/router/routeGenerator.dart +++ b/Frontend/patient_manager/lib/router/routeGenerator.dart @@ -6,6 +6,7 @@ import 'package:patient_manager/components/signInOrRegister.dart'; import 'package:patient_manager/objects/appUser.dart'; import 'package:patient_manager/objects/arguments.dart'; import 'package:patient_manager/objects/patients.dart'; +import 'package:patient_manager/pages/fullScreenFile.dart'; import 'package:patient_manager/pages/home.dart'; import 'package:patient_manager/pages/patientAccessReview.dart'; import 'package:patient_manager/pages/patientAdd.dart'; @@ -100,6 +101,16 @@ class RouteGenerator { } return _errorRoute(); + case '/file-veiwer': + if (args is FileViewArguments) { + return MaterialPageRoute( + builder: (_) => FullScreenFileViewer( + arguments: args, + ), + ); + } + return _errorRoute(); + case '/business-profile': if (args is BusinessArguments) { return MaterialPageRoute(