Flutter中基于Stateful Widget切换导航时处理返回按钮与手势

你的当前方案通过单个变量currentScreen切换页面，但未维护页面历史栈，导致系统返回按钮和侧滑手势无法识别页面层级。要解决这个问题，需要手动维护页面历史栈，并拦截系统返回事件处理自定义回退逻辑。

解决步骤 #

1. 维护页面历史栈：用列表保存所有访问过的页面序号，替代单个currentScreen变量，追踪页面前进/后退路径。
2. 拦截系统返回事件：使用WillPopScope包裹Scaffold，处理返回按钮点击和侧滑返回的回调，手动控制页面回退。
3. 更新页面切换逻辑：前进页面时将新页面序号加入栈，回退时移除栈顶元素，始终展示栈的最后一个页面。

修改后的完整代码 #

class AuthenticationController extends StatefulWidget {
  const AuthenticationController(this.user, this.currentScreen, {Key? key})
      : super(key: key);

  final User user;
  final int currentScreen;
  @override
  State<AuthenticationController> createState() =>
      _AuthenticationControllerState();
}

class _AuthenticationControllerState extends State<AuthenticationController> {
  // 用列表维护页面历史栈
  List<int> screenStack = [];

  @override
  void initState() {
    super.initState();
    // 初始化栈，加入初始页面
    screenStack.add(widget.currentScreen);
  }

  // 前进到下一个页面
  void switchScreenFn(int nextScreen) {
    setState(() {
      screenStack.add(nextScreen);
    });
  }

  // 处理系统返回事件
  Future<bool> _handleBackPress() async {
    if (screenStack.length > 1) {
      // 栈长度大于1时，回退到上一个页面
      setState(() {
        screenStack.removeLast();
      });
      // 返回false阻止系统默认的返回行为
      return false;
    }
    // 栈只有一个页面时，允许退出当前页面
    return true;
  }

  @override
  Widget build(BuildContext context) {
    // 用WillPopScope拦截返回事件
    return WillPopScope(
      onWillPop: _handleBackPress,
      child: Scaffold(
        body: Container(
          padding: const EdgeInsets.all(10),
          child: Center(
            child: Builder(
              builder: (context) {
                // 展示栈的最后一个页面
                switch (screenStack.last) {
                  case 1:
                    return PhoneNumber(widget.user, switchScreenFn);
                  case 2:
                    return OneTimeCode(widget.user, switchScreenFn);
                  case 3:
                    return DisplayName(widget.user, switchScreenFn);
                  case 4:
                    return ProfilePicture(widget.user, switchScreenFn);
                  case 5:
                    return ConversationsController(widget.user, switchScreenFn);
                  default:
                    return const Center(
                      child: Text('Authentication!'),
                    );
                }
              },
            ),
          ),
        ),
      ),
    );
  }
}

关键说明 #

• 页面栈screenStack：记录用户访问过的所有页面，保证回退时能定位到上一个页面的序号。
• WillPopScope：拦截系统返回事件（包括导航栏返回按钮和iOS侧滑返回），通过onWillPop回调自定义回退逻辑。
• _handleBackPress：判断栈的长度，若存在历史页面则执行回退并阻止系统默认行为；若栈中只剩初始页面，则允许退出当前页面。

修改后，用户点击返回按钮或使用侧滑手势时，就能正常在各页面之间来回切换。

内容的提问来源于stack exchange，提问作者Sumchans