android – Flutter WebView and Again Button with PopScope displaying a black display screen

I’m engaged on a Flutter utility that makes use of WebView to load a sure webpage. I wish to use the again button such that if a person goes to a special web page of the web site from throughout the WebView, it navigates to the earlier web page, similar to a browser, in any other case it goes to the house display screen of the app. The WebView is on Page3, which is on index 2. But when the person cannot return to some other pages contained in the WebView it ought to take the person to Page1, which is the house display screen for the app.

I’ve applied PopScope. Nonetheless, on urgent the again button I get a black display screen on the app as an alternative.

The next are my codes.

WebView Web page

@override
  Widget construct(BuildContext context) {
    return PopScope(
      canPop: true,
      onPopInvokedWithResult: (didPop, consequence) async {
        if (await controller.canGoBack()) {
          await controller.goBack();
        } else {
          SystemNavigator.pop();
        }
      },
      little one: Scaffold(
        backgroundColor: const Colour(0xFF000000),
        physique: Padding(
          padding: EdgeInsets.solely(
              backside: MediaQuery.of(context).dimension.top * 0.01),
          little one: SafeArea(
            little one: WebViewWidget(
              controller: controller,
            ),
          ),
        ),
      ),
    );
  }

navbar_widget.dart

class BottomNavbar extends StatelessWidget {
  const BottomNavbar({tremendous.key});

  @override
  Widget construct(BuildContext context) {
    return GetBuilder<BottomNavbarController>(
      builder: (controller) => Scaffold(
        extendBody: true,
        appBar: AppbarWidget(tabIndex: controller.tabIndex),
        bottomNavigationBar: CurvedNavigationBar(
          index: controller.tabIndex,
          onTap: (val) {
            controller.updateIndex(val);
          },
          gadgets: const [
            Icon(Icons.page_1),
            Icon(Icons.page_2),
            Icon(Icons.page_3),
            Icon(Icons.page_4),
            Icon(Icons.page_5),
          ],
        ),
        physique: Padding(
          padding:
              EdgeInsets.solely(high: MediaQuery.of(context).dimension.top * 0.018),
          little one: SafeArea(
            backside: false,
            little one: IndexedStack(
              index: controller.tabIndex,
              kids: const [
                PageOne(),
                PageTwo(),
                PageThree(),
                PageFour(),
                PageFive(),
              ],
            ),
          ),
        ),
      ),
    );
  }
}