带有返回数据的Flutter Back按钮

Question

我有一个带有两个按钮的界面，这些按钮会弹出并返回true或false，如下所示：

onPressed: () => Navigator.pop(context, false)

我需要调整应用栏中的后退按钮，因此它会弹出并返回false。有没有办法做到这一点？

Answer 1

更简单的方法是将 body 包裹在WillPopScope 中，这样它将与顶部的后退按钮和底部的Android 后退按钮一起使用。

这是两个后退按钮都返回 false 的示例：

final return = Navigator.of(context).push(MaterialPageRoute<bool>(
    builder: (BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          title: Text("New Page"),
        ),
        body: WillPopScope(
          onWillPop: () async {
             Navigator.pop(context, false);
             return false;
          },
          child: newPageStuff(),
        ),
      );
    },
));

在他们建议使用的其他答案中：

领先：BackButton(...)

我发现这适用于顶部的后退按钮，而不适用于 Android 按钮。

我无论如何包括一个例子：

final return = Navigator.of(context).push(MaterialPageRoute<bool>(
    builder: (BuildContext context) {
      return Scaffold(
        appBar: AppBar(
          leading: BackButton(
            onPressed: () => Navigator.pop(context, false),
          ),
          title: Text("New Page"),
        ),
        body: newPageStuff(),
      );
    },
));

Answer 2

默认值BackButton接管您的Leading属性，AppBar因此您所需要做的就是leading使用自定义后退按钮覆盖该属性，例如：

leading: IconButton(icon:Icon(Icons.chevron_left),onPressed:() => Navigator.pop(context, false),),)

Answer 3

这可能对您有帮助并为您工作

第一屏

void goToSecondScreen()async {
 var result = await Navigator.push(_context, new MaterialPageRoute(
 builder: (BuildContext context) => new SecondScreen(context),
 fullscreenDialog: true,)
);

Scaffold.of(_context).showSnackBar(SnackBar(content: Text("$result"),duration: Duration(seconds: 3),));

}

第二屏

Navigator.pop(context, "Hello world");

Answer 4

实现这一目标的最简单方法是：

\n\n

在你的身体中，将 aWillPopScope作为父小部件\n并在其onWillPop : () {}调用时

\n\n

Navigator.pop(context, false);\n

\n\n

onWillPopWillPopScope当您按下 AppBar 上的后退按钮时，将自动触发

\n

Answer 5

要弹出数据并在导航上传递数据，您需要在.then()屏幕1 上使用。以下是示例。

屏幕2：

class DetailsClassWhichYouWantToPop {
  final String date;
  final String amount;
  DetailsClassWhichYouWantToPop(this.date, this.amount);
}

void getDataAndPop() {
      DetailsClassWhichYouWantToPop detailsClass = new DetailsClassWhichYouWantToPop(dateController.text, amountController.text);
      Navigator.pop(context, detailsClass); //pop happens here
  }

new RaisedButton(
    child: new Text("Edit"),
    color:  UIData.col_button_orange,
    textColor: Colors.white,
    onPressed: getDataAndPop, //calling pop here
  ),

屏幕1：

    class Screen1 extends StatefulWidget {
          //var objectFromEditBill;
          DetailsClassWhichYouWantToPop detailsClass;

          MyBills({Key key, this.detailsClass}) : super(key: key);

          @override
          Screen1State createState() => new Screen1State();
        }

        class Screen1State extends State<Screen1> with TickerProviderStateMixin {


        void getDataFromEdit(DetailsClassWhichYouWantToPop detailClass) {
        print("natureOfExpense Value:::::: " + detailClass.date);
        print("receiptNumber value::::::: " + detailClass.amount);
      }

      void getDataFromEdit(DetailsClassWhichYouWantToPop detailClass) {
        print("natureOfExpense Value:::::: " + detailClass.natureOfExpense);
        print("receiptNumber value::::::: " + detailClass.receiptNumber);
      }

      void pushFilePath(File file) async {
        await Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) => Screen2(fileObj: file),
          ),
        ).then((val){
          getDataFromScreen2(val); //you get details from screen2 here
        });
      }
   }

Answer 6

虽然您可以覆盖自定义行为的后退按钮，但不要这样做。

您应该处理 null 场景，而不是使用自定义弹出窗口覆盖按钮。您不想手动覆盖图标有几个原因：

• IOS 和 Android 上的图标发生变化。在IOS上它使用arrow_back_ios而android上使用arrow_back
• 如果没有返回路线，该图标可能会自动消失
• 物理后退按钮仍然会返回null。

相反应该执行以下操作：

var result = await Navigator.pushNamed<bool>(context, "/");
if (result == null) {
  result = false;
}