如何在 GetPage Flutter 中使用自定义转换答案

【问题标题】：How to use Custom Transition in GetPage flutter如何在 GetPage Flutter 中使用自定义转换
【发布时间】：2021-04-24 19:29:35
【问题描述】：

我有 CustomPageRoute 用于导航到具有自定义转换的新页面。

为了导航，我使用以下代码：

Navigator.push(
    context,
    CustomPageRoute(
        NewScreen(),
    ),
),

这很好用，但现在我想在 getx 库中使用 GetPage 来添加依赖项。

GetPage(
    name: Routes.NEW_SCREEN,
    page: () => NewScreen(),
    binding: NewScreenBinding(),
),

所以我必须使用Get.toNamed(Routes.NEW_SCREEN) 导航，而我的自定义转换不起作用。

如何将我的自定义转换与GetPage 集成

这是我的自定义过渡：

class CustomPageRoute<T> extends PageRoute<T> {
  final Widget child;

  CustomPageRoute(this.child);

  @override
  Color get barrierColor => Colors.black;

  @override
  String get barrierLabel => '';

  @override
  bool get maintainState => true;

  @override
  Duration get transitionDuration => Duration(milliseconds: 600);

  @override
  Widget buildPage(
    BuildContext context,
    Animation<double> animation,
    Animation<double> secondaryAnimation,
  ) {
    return FadeTransition(
      opacity: animation,
      child: child,
    );
  }
}

【问题讨论】：

标签： flutter flutter-getx

【解决方案1】：

我认为这可以更简单一些。像这样创建一个类...

class Go {
  static Future<dynamic> to(dynamic page, {dynamic arguments}) async {
    Get.to(
      page,
      arguments: arguments,
      transition: Transition.fadeIn, // choose your page transition accordingly
      duration: const Duration(milliseconds: 300),
    );
  }
}

然后在您的视图或控制器中

Go.to(
  () => OtpView(),
  arguments: 'your dynamic argument' 
);

【讨论】：

【解决方案2】：

您可以在 GetMaterialApp 小部件中从 main.dart 更改默认过渡

GetMaterialApp(
     defaultTransition: Transition.fadeIn,
      //or customTransition
      initialBinding: InitialBindings(),
      initialRoute: '/',
      getPages: [
       ...
      ],
      ...
    );

或者您可以像这样在 GetPage 对象中添加过渡：

GetPage(
    name: Routes.NEW_SCREEN,
    page: () => NewScreen(),
    binding: NewScreenBinding(),
    transition: Transition.fadeIn,
    //or customTransition
),

您还可以编辑此过渡的持续时间通过编辑默认值

transitionDuration

或者您可以通过编辑的值来使用 CustomTransition 对象

customTransition

【讨论】：