root_tab.dart

  ElevatedButton(
            onPressed: () {
              context.go('/transition');
            },
            child: Text('Transition Screen'),
          ),

transation1.dart

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:go_router_v7_actual/layout/default_layout.dart';

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

  @override
  Widget build(BuildContext context) {
    return DefaultLayout(
      body: Container(
        color: Colors.red,
        child: ListView(
          children: [
            ElevatedButton(
              onPressed: () {
                context.go('/transition/detail');
              },
              child: Text(
                'Go to Detail',
              ),
            ),
          ],
        ),
      ),
    );
  }
}

transation2.dart

import 'package:flutter/material.dart';
import 'package:go_router/go_router.dart';
import 'package:go_router_v7_actual/layout/default_layout.dart';

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

  @override
  Widget build(BuildContext context) {
    return DefaultLayout(
      body: Container(
        color: Colors.blue,
        child: ListView(
          children: [
            ElevatedButton(
              onPressed: () {
                context.pop();
              },
              child: Text('POP'),
            ),
          ],
        ),
      ),
    );
  }
}

router.dart

GoRoute(
          path: 'transition',
          builder: (_, state) => TransitionScreenOne(),
          routes: [
            GoRoute(
              path: 'detail',
              pageBuilder: (_, state) => CustomTransitionPage(
                transitionDuration: Duration(seconds: 3),
                transitionsBuilder:
                    (context, animation, secondaryAnimation, child) {
                  return FadeTransition(
                    opacity: animation, // 0에서부터 1로 늘어남
                    child: child, // 아래의 child가 들어옴
                  );
                },
                child: TransitionScreenTwo(),
              ),
            ),
          ],
        ),

secondaryAnimation은 1에서 0 : pop 됐을때의 애니메이션

FadeTransition 외에도

ScaleTransition(
	scale : animation,
	child : child
);
},
child : TransitionScreenTwo()

가운데에서 확대 축소가 이루어지는 애니메이션을 만들 수 있다