flutter materialpageroute 无动画 - Dart (1)

📌 相关文章

📜 flutter materialpageroute 无动画 - Dart (1)

📅 最后修改于: 2023-12-03 15:15:07.546000 🧑 作者: Mango

Flutter MaterialPageRoute 无动画 - Dart

在 Flutter 中， MaterialPageRoute 是一种用于在应用程序中创建新页面并支持转换动画效果的方式。默认情况下，它会应用一个简单的淡入淡出效果，但有时您可能希望在不应用任何转换动画的情况下打开新页面。在这种情况下，使用 PageRouteBuilder 和 FadeTransition 可以获得所需的结果。

步骤

通过使用 PageRouteBuilder 可以创建一个自定义的页面过渡动画效果。

class CustomPageRoute<T> extends PageRoute<T> {
  CustomPageRoute({this.builder, RouteSettings settings})
      : super(settings: settings);
  final WidgetBuilder builder;

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

在你的页面上调用 Navigator.push() 方法，并使用对应的 CustomPageRoute 过渡动画。
```
Navigator.push(context, new CustomPageRoute(builder: (BuildContext context) => new MyPage()));
```

通过这种方式，您将能够实现与默认页面路由相同的功能，但没有转换动画效果。

结论

本文介绍了如何使用 PageRouteBuilder 和 FadeTransition 来创建使用 Flutter 中的 MaterialPageRoute 的无动画效果。通过使用这种方法，您可以控制应用程序中页面转换的效果，以实现定制的用户体验。

```markdown

Flutter MaterialPageRoute 无动画 - Dart

步骤

通过使用 PageRouteBuilder 可以创建一个自定义的页面过渡动画效果。

class CustomPageRoute<T> extends PageRoute<T> {
  CustomPageRoute({this.builder, RouteSettings settings})
      : super(settings: settings);
  final WidgetBuilder builder;

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

在你的页面上调用 Navigator.push() 方法，并使用对应的 CustomPageRoute 过渡动画。
```
Navigator.push(context, new CustomPageRoute(builder: (BuildContext context) => new MyPage()));
```

通过这种方式，您将能够实现与默认页面路由相同的功能，但没有转换动画效果。