flutter - 任何人都可以为我配置此代码的后退按钮吗？

Question

当我按下设备的后退按钮时，应用程序关闭，所以我想配置设备的后退按钮以返回序列页面而不退出。谢谢

import 'package:flutter/material.dart';
    import 'package:webview_flutter/webview_flutter.dart';
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          debugShowCheckedModeBanner: false,
          title: 'Welcome to Flutter',
          home: Scaffold(
            body: WebView(
              initialUrl: "https://www.carrefourjordan.com",
              javascriptMode: JavascriptMode.unrestricted,
            ),
          ),
        );
      }
    }

Answer 1

您可以通过 2 个步骤实现此目的：

1. 将 Scaffold 包裹在 aWillPopScope中以捕获后退按钮按下事件
2. 使用 webview 包InAppWebView控制器的canGoback()并goBack()移入 WeView

尝试这个：

  class MyApp extends StatelessWidget {
  InAppWebViewController _webViewController;

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Welcome to Flutter',
      home: WillPopScope(
        onWillPop: _onBack,
        child: Scaffold(
          body: InAppWebView(
            initialUrl: "https://www.carrefourjordan.com",
            onWebViewCreated: (InAppWebViewController controller) {
              _webViewController = controller;
            },
          ),
        ),
      ),
    );
  }

  Future<bool> _onBack() async {
    if (await _webViewController.canGoBack()) {
      _webViewController.goBack(); // perform webview back operation
      return false;
    } else {
      // Webpage in home page
      return true; // Close App
    }
  }
}

Answer 2

您好，通过将脚手架包裹在 willpopscope 内并使用 onwillpop 属性来管理后退按钮按下使用 Willpopscope

WillPopScope(
  onWillPop: (){
   // Navigator.push(context, MaterialPageRoute(builder: (context)=>Page()));
       return Future.value(false);
  },
  child: Scaffold(
    body: WebView(
      initialUrl: "https://www.carrefourjordan.com",
      javascriptMode: JavascriptMode.unrestricted,
    ),
  ),
);