custom_route_transition_jacd 是一个用于 Flutter 的自定义路由过渡动画插件，它允许开发者轻松地为页面之间的导航添加自定义的过渡动画。以下是如何使用这个插件的基本步骤：

1. 添加依赖

首先，在你的 pubspec.yaml 文件中添加 custom_route_transition_jacd 依赖：

dependencies:
  flutter:
    sdk: flutter
  custom_route_transition_jacd: ^1.0.0  # 请使用最新版本

然后运行 flutter pub get 来安装依赖。

2. 导入包

在你的 Dart 文件中导入 custom_route_transition_jacd：

import 'package:custom_route_transition_jacd/custom_route_transition_jacd.dart';

3. 使用自定义路由过渡动画

你可以使用 CustomRouteTransition 来定义页面之间的过渡动画。以下是一个简单的示例：

Navigator.push(
  context,
  CustomRouteTransition(
    builder: (context) => SecondPage(),  // 目标页面
    transitionType: TransitionType.fade, // 过渡动画类型
    duration: Duration(milliseconds: 500), // 动画持续时间
  ),
);

4. 可用的过渡动画类型

CustomRouteTransition 提供了多种内置的过渡动画类型，你可以通过 transitionType 参数来选择：

• TransitionType.fade: 淡入淡出
• TransitionType.slide: 滑动
• TransitionType.scale: 缩放
• TransitionType.rotation: 旋转
• TransitionType.custom: 自定义动画（需要提供 CustomTransitionBuilder）

5. 自定义过渡动画

如果你想要使用自定义的过渡动画，可以将 transitionType 设置为 TransitionType.custom，并提供一个 CustomTransitionBuilder：

Navigator.push(
  context,
  CustomRouteTransition(
    builder: (context) => SecondPage(),
    transitionType: TransitionType.custom,
    customTransitionBuilder: (context, animation, secondaryAnimation, child) {
      return FadeTransition(
        opacity: animation,
        child: ScaleTransition(
          scale: animation,
          child: child,
        ),
      );
    },
    duration: Duration(milliseconds: 500),
  ),
);

6. 其他配置

你还可以通过 curve 参数来设置动画的曲线：

Navigator.push(
  context,
  CustomRouteTransition(
    builder: (context) => SecondPage(),
    transitionType: TransitionType.slide,
    duration: Duration(milliseconds: 500),
    curve: Curves.easeInOut, // 动画曲线
  ),
);

7. 示例代码

以下是一个完整的示例代码：

import 'package:flutter/material.dart';
import 'package:custom_route_transition_jacd/custom_route_transition_jacd.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: FirstPage(),
    );
  }
}

class FirstPage extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('First Page')),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Navigator.push(
              context,
              CustomRouteTransition(
                builder: (context) => SecondPage(),
                transitionType: TransitionType.slide,
                duration: Duration(milliseconds: 500),
                curve: Curves.easeInOut,
              ),
            );
          },
          child: Text('Go to Second Page'),
        ),
      ),
    );
  }
}

class SecondPage extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Second Page')),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Navigator.pop(context);
          },
          child: Text('Go back'),
        ),
      ),
    );
  }
}