flutter 按下后退按钮后如何重建屏幕

tkclm6bt  于 2023-06-07  发布在  Flutter
关注(0)|答案(2)|浏览(262)

我刚开始学习Flutter,正在学习导航。我的应用程序中有两个屏幕。第一个屏幕有一个按钮,它将一个命名的路由沿着参数一起推到第二个屏幕。第二个屏幕显示参数,当按下appBar上的后退按钮时,我希望第一个屏幕完全重建。我试着弹出第一个屏幕,然后再推一次,这会导致一些错误的行为。还有别的办法吗?
我在模拟器上运行代码。

wpx232ag

wpx232ag1#

**返回按钮在屏幕上的行为取决于您用于开发的平台或框架。**1.确定平台/框架:确定您正在使用的平台或框架,例如Android,iOS或Web(React,Angular等)。不同的平台有不同的机制来处理后退按钮。

2.监听返回按钮按下事件:大多数平台都提供了一个事件或回调,当按下后退按钮时会触发该事件或回调。您需要为此事件标识并注册一个侦听器。

zour9fqk

zour9fqk2#

这实际上是一项非常普遍的任务。
要在弹出第二个屏幕后重建第一个屏幕,您可以执行以下操作:
假设您使用Navigator.push将一个新屏幕推到堆栈上,Navigator.push在从第二个屏幕弹出后返回Future。因此只需使用.then()并调用setState

ElevatedButton(
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => const SecondScreen()),
                ).then((_) => setState(() {}));
              },
              child: const Text('Launch screen'),
            ),

这里是一个完整的工作示例,它将在每次从第二个屏幕推送时更新 * 第一个 * 屏幕上的计数器变量(和UI):

import 'package:flutter/material.dart';

void main() {
  runApp(
    const MaterialApp(
      title: 'Updating the first Screen',
      home: FirstScreen(),
    ),
  );
}

class FirstScreen extends StatefulWidget {
  const FirstScreen({Key? key}) : super(key: key);

  @override
  State<FirstScreen> createState() => _FirstScreenState();
}

class _FirstScreenState extends State<FirstScreen> {
  var _counter = 0;
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
          body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              'Counter is $_counter',
            ),
            ElevatedButton(
              onPressed: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => const SecondScreen()),
                ).then((_) => setState(() {
                      _counter++;
                    }));
              },
              child: const Text('Launch screen'),
            ),
          ],
        ),
      )),
    );
  }
}

class SecondScreen extends StatelessWidget {
  const SecondScreen({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const Scaffold(body: Center(child: Text('Second Screen')));
  }
}

相关问题