如何移除Flutter AppBar返回按钮的页面过渡动画？

你遇到的这个问题很典型——默认的Navigator.pop(context)会触发Flutter自带的页面过渡动画，要实现点击返回按钮时无动画关闭页面，这里有两种简单实用的解决方案：

方案一：直接移除当前路由（推荐） #

修改你AppBar中IconButton的onPressed方法，用removeRoute替代默认的pop，这样会直接从导航栈中移除当前页面，完全跳过过渡动画逻辑：

AppBar(
  title: Text('Sample'),
  leading: IconButton(
    onPressed: () {
      final currentRoute = ModalRoute.of(context);
      if (currentRoute != null) {
        Navigator.of(context).removeRoute(currentRoute);
      }
    },
    icon: Icon(Icons.navigate_before),
  ),
)

原理说明 #

removeRoute是Navigator的底层操作方法，它会直接将指定路由从导航栈中删除，不会触发任何预设的过渡动画，刚好匹配你只在返回时禁用动画的需求。

方案二：自定义无动画路由（适合全局控制） #

如果你希望当前页面无论是进入还是退出都没有动画，可以在跳转至当前页面时使用自定义的无动画路由配置，这样后续点击默认的pop也不会有动画：

// 跳转当前页面时的代码示例
Navigator.push(
  context,
  PageRouteBuilder(
    pageBuilder: (context, animation, secondaryAnimation) => YourCurrentPage(),
    // 禁用进入和退出的过渡动画
    transitionDuration: Duration.zero,
    reverseTransitionDuration: Duration.zero,
  ),
);

这种方法适合需要全局统一控制页面过渡的场景，但如果你只需要在返回按钮时禁用动画，方案一更灵活轻便。

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