增加webview用的进度条

lib/pages/web/webview_page.dart

@@ -1,6 +1,7 @@
 import 'package:auto_route/annotations.dart';
 import 'package:eitc_erm_dental_flutter/exts.dart';
 import 'package:eitc_erm_dental_flutter/funcs.dart';
+import 'package:eitc_erm_dental_flutter/widget/webview_progress_bar.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_inappwebview/flutter_inappwebview.dart';
@@ -34,6 +35,9 @@ class _WebviewPageState extends State<WebviewPage> {
       iframeAllowFullscreen: true,
       javaScriptEnabled: true);
 
+  final WebviewProgressBarController _progressBarController =
+      WebviewProgressBarController();
+
   @override
   void initState() {
     super.initState();
@@ -42,6 +46,7 @@ class _WebviewPageState extends State<WebviewPage> {
   @override
   void dispose() {
     super.dispose();
+    _progressBarController.dispose();
   }
 
   void _load() async {
@@ -67,35 +72,44 @@ class _WebviewPageState extends State<WebviewPage> {
       ),
       //body: SafeArea(child: WebViewWidget(controller: _controller)),
       body: SafeArea(
-        child: InAppWebView(
-          key: _webViewKey,
-          initialSettings: _settings,
-          onWebViewCreated: (controller) {
-            _webViewController = controller;
-            _load();
-          },
-          onLoadStart: (controller, url) {
-            logd("onLoadStart,url=$url");
-          },
-          onPermissionRequest: (controller, request) async {
-            return PermissionResponse(
-                resources: request.resources,
-                action: PermissionResponseAction.GRANT);
-          },
-          onLoadStop: (controller, url) async {
-            logd("onLoadStop,url=$url");
-          },
-          onReceivedError: (controller, request, error) {
-            loge("onReceivedError", error: error);
-          },
-          onProgressChanged: (controller, progress) {
-            logd("onProgressChanged,progress=$progress");
-          },
-          onConsoleMessage: (controller, consoleMessage) {
-            if (kDebugMode) {
-              logd(consoleMessage);
-            }
-          },
+        child: Stack(
+          children: [
+            InAppWebView(
+              key: _webViewKey,
+              initialSettings: _settings,
+              onWebViewCreated: (controller) {
+                _webViewController = controller;
+                _load();
+              },
+              onLoadStart: (controller, url) {
+                logd("onLoadStart,url=$url");
+              },
+              onPermissionRequest: (controller, request) async {
+                return PermissionResponse(
+                    resources: request.resources,
+                    action: PermissionResponseAction.GRANT);
+              },
+              onLoadStop: (controller, url) async {
+                logd("onLoadStop,url=$url");
+              },
+              onReceivedError: (controller, request, error) {
+                loge("onReceivedError", error: error);
+              },
+              onProgressChanged: (controller, progress) {
+                logd("onProgressChanged,progress=$progress");
+                _progressBarController.setProgress(progress);
+              },
+              onConsoleMessage: (controller, consoleMessage) {
+                if (kDebugMode) {
+                  logd(consoleMessage);
+                }
+              },
+            ),
+            Align(
+              alignment: Alignment.topLeft,
+              child: WebviewProgressBar(controller: _progressBarController),
+            )
+          ],
         ),
       ),
     );

lib/widget/webview_progress_bar.dart

@@ -0,0 +1,73 @@
+import 'package:flutter/material.dart';
+
+///Webview进度条
+class WebviewProgressBar extends StatefulWidget {
+  final WebviewProgressBarController controller;
+  final bool autoHide;
+  final Color? backgroundColor;
+  final Color? color;
+  final Animation<Color?>? valueColor;
+  final String? semanticsLabel;
+  final String? semanticsValue;
+  final BorderRadiusGeometry borderRadius;
+
+  const WebviewProgressBar(
+      {super.key,
+      required this.controller,
+      this.autoHide = true,
+      this.backgroundColor,
+      this.color,
+      this.valueColor,
+      this.semanticsLabel,
+      this.semanticsValue,
+      this.borderRadius = BorderRadius.zero});
+
+  @override
+  State<WebviewProgressBar> createState() => _WebviewProgressBarState();
+}
+
+class _WebviewProgressBarState extends State<WebviewProgressBar> {
+  @override
+  void initState() {
+    super.initState();
+    widget.controller.progress.addListener(() {
+      setState(() {});
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    WebviewProgressBarController controller = widget.controller;
+    if (controller.progress.value >= 100 && widget.autoHide) {
+      return SizedBox();
+    }
+    return LinearProgressIndicator(
+      value: controller.progress.value / 100,
+      backgroundColor: widget.backgroundColor,
+      color: widget.color,
+      valueColor: widget.valueColor,
+      semanticsLabel: widget.semanticsLabel,
+      semanticsValue: widget.semanticsValue,
+      borderRadius: widget.borderRadius,
+    );
+  }
+}
+
+///Webview进度条控制器
+class WebviewProgressBarController {
+  ///进度
+  ValueNotifier<int>? _progress;
+
+  ///进度
+  ValueNotifier<int> get progress => _progress ??= ValueNotifier(0);
+
+  ///设置进度
+  void setProgress(int value) {
+    progress.value = value;
+  }
+
+  void dispose() {
+    _progress?.dispose();
+    _progress = null;
+  }
+}