如何在GoRouter颤振中添加信息

Question

如何在GoRouter中添加信息，颤振，如果动画类可以坐在一个独立的文件中，这样我就可以有那么多的动画类来调用不同的页面。码源

void main() => runApp(App());

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

  static const String title = 'GoRouter Example: Declarative Routes';

  @override
  Widget build(BuildContext context) => MaterialApp.router(
        routerConfig: _router,
        title: title,
      );

  final GoRouter _router = GoRouter(
    routes: <GoRoute>[
      GoRoute(
        path: '/',
        builder: (BuildContext context, GoRouterState state) =>
            const Page1Screen(),
        routes: <GoRoute>[
          GoRoute(
            path: 'page2',
            builder: (BuildContext context, GoRouterState state) =>
                const Page2Screen(),
          ),
        ],
      ),
    ],
  );
}

Answer 1

您可以扩展CustomTranstionPage以创建自定义转换动画。

一个例子：

import 'package:flutter/widgets.dart';
import 'package:go_router/go_router.dart';
    
class CustomSlideTransition extends CustomTransitionPage<void> {
      CustomSlideTransition({super.key, required super.child})
          : super(
              transitionDuration: const Duration(milliseconds: 250),
              transitionsBuilder: (_, animation, __, child) {
                return SlideTransition(
                  position: animation.drive(
                    Tween(
                      begin: const Offset(1.5, 0),
                      end: Offset.zero,
                    ).chain(
                      CurveTween(curve: Curves.ease),
                    ),
                  ),
                  child: child,
                );
              },
            );
    }


// In your router:

GoRoute(
    name: 'my_page',
    path: '/my_page',
    pageBuilder: (_, state) {
      return CustomSlideTransition(
        key: state.pageKey,
        child: MyPage(),
      );
   },
),

Answer 2

“构建器负责构建要在屏幕上显示的Widget。或者，您可以使用pageBuilder来自定义该路由激活时的过渡动画。”