Flutter点击返回按钮时PageTransitionSwitcher过渡动画不生效问题

你当前的写法存在核心逻辑错误：PageTransitionSwitcher 是 Flutter animations 包提供的布局组件，不是可在点击回调中直接调用的动画函数。你在 onPress 回调中创建的 PageTransitionSwitcher 实例没有挂载到 Widget 渲染树上，完全不会触发任何动画效果。

根据你的页面路由逻辑，可选择以下两种适配方案：

方案1：单页面内切换视图（无Navigator路由跳转） #

如果个人资料页和目标页 NewMainTabs 是同一个路由下的两个视图，通过状态变量控制展示逻辑：

1. 声明状态变量控制当前展示的视图：

bool _showProfile = true;

2. 将 PageTransitionSwitcher 放在当前页面的根布局位置，通过修改状态触发动画：

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      leading: IconButton(
        icon: const Icon(Icons.arrow_back),
        // 返回按钮仅修改状态触发组件重建
        onPress: () => setState(() => _showProfile = false),
      ),
    ),
    // PageTransitionSwitcher作为根布局容器
    body: PageTransitionSwitcher(
      transitionBuilder: (child, animation, secondaryAnimation) =>
          SharedAxisTransition(
            animation: animation,
            secondaryAnimation: secondaryAnimation,
            transitionType: SharedAxisTransitionType.horizontal,
            child: child,
          ),
      // 不同视图必须绑定唯一Key，组件才能识别视图变化触发动画
      child: _showProfile 
          ? const UserProfilePage(key: Key('profile')) 
          : const NewMainTabs(key: Key('mainTabs')),
    ),
  );
}

方案2：跨路由页面跳转（通过Navigator.push打开个人资料页） #

如果个人资料页是通过 Navigator.push 独立打开的新路由，不需要用 PageTransitionSwitcher，直接自定义路由过渡效果即可：

1. 跳转进入个人资料页时使用自定义过渡路由：

Navigator.push(
  context,
  PageRouteBuilder(
    pageBuilder: (context, animation, secondaryAnimation) => const UserProfilePage(),
    transitionsBuilder: (context, animation, secondaryAnimation, child) {
      return SharedAxisTransition(
        animation: animation,
        secondaryAnimation: secondaryAnimation,
        transitionType: SharedAxisTransitionType.horizontal,
        child: child,
      );
    },
  ),
);

2. 返回按钮直接调用系统返回逻辑即可自动触发反向过渡动画：

onPress: () => Navigator.pop(context),

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