white screen on inappwebview after resuming app from background on android and ios?

Question

When I close the app for around a minute and then move it to the background before resuming, the InAppWebView widget is covered by a white overlay, or it just doesn't show the web content on the screen. I can still interact with the page that was loaded before the app was suspended, and I can hear sound effects that play on the site, so it's definitely still active in some way. I'm just confused about how I can get it to actually SHOW the page when I resume the app. The debug console shows nothing out of the ordinary when I reopen the app from being suspended; it's the exact same output as when the InAppWebView was actually visible.

I've tried making a basic implementation of InAppWebView in my app, using a different URL, running flutter clean, running flutter pub upgrade, running flutter pub downgrade, and I still get the issue. Here's the code for the page.

class CustomWebView extends StatefulWidget {
  final String url;

  CustomWebView({required this.url});

  @override
  _CustomWebViewState createState() => _CustomWebViewState();
}

class _CustomWebViewState extends State<CustomWebView>
    with SingleTickerProviderStateMixin, WidgetsBindingObserver {
  bool _isLoading = true; // Initially, webview is loading
  late InAppWebViewController webcontroller;

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return InAppWebView(
      key: Key('webview'),
      initialOptions: InAppWebViewGroupOptions(
        crossPlatform: InAppWebViewOptions(
          transparentBackground: true,
          useShouldOverrideUrlLoading: true,
          supportZoom: true,
        ),
        android: AndroidInAppWebViewOptions(
          builtInZoomControls: true,
          loadWithOverviewMode: true,
          useWideViewPort: true,
        ),
        ios: IOSInAppWebViewOptions(
          disableInputAccessoryView: true,
          allowsInlineMediaPlayback: true,
        ),
      ),
      initialUrlRequest: URLRequest(url: Uri.parse(widget.url)),
      shouldOverrideUrlLoading: (controller, navigationAction) async {
        var uri = navigationAction.request.url!;
        if (uri.toString().contains('logout')) {
          logOut(context);
          return NavigationActionPolicy.CANCEL;
        }
        if (uri.toString().contains('whatsapp')) {
          var shareText = await getTextParam(uri.toString());
          Share.share(shareText!);
          return NavigationActionPolicy.CANCEL;
        }
        if (uri.toString().contains('?process_s=3')) {
          var status = await Permission.storage.status;
          if (!status.isGranted) {
            status = await Permission.storage.request();
          }
          if (status.isGranted) {
            Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) => GenerateQRPage(
                          url: '',
                        )));
          }
          return NavigationActionPolicy.CANCEL;
        }

        return NavigationActionPolicy.ALLOW;
      },
      onWebViewCreated: (InAppWebViewController controller) {
        webcontroller = controller;
      },
      onLoadStop: (controller, url) async {},
    );
  }
}

Answer 1

fixed this issue by updating inappwebview to the latest version. its always the simplest solutions haha