1

这个问题已经在这里讨论了一点，但是没有一个解决方案是干净的，或者做奇怪的事情，比如两次显示同一个页面。 Flutter 过渡出口

我正在努力做到这一点，因此当您导航到下一页时，当前页面向左滑动，而下一页从右侧进入。但是，我能想出的最佳解决方案是将当前页面的内容包装在 SlideTransition 中。当您导航到下一页时，您开始在“SlideRightRoute”动画中打开新页面，同时您开始制作动画以将当前页面滑出。

虽然这行得通，但感觉就像我在“反对框架工作”。我的问题是：是否有一种“正确”的方式来为页面设置动画，或者这目前是框架中的一个漏洞（这样的解决方案确实是我们目前能做的最好的解决方案）？

abstract class SlideablePage<T extends StatefulWidget> 
extends State<T> with SingleTickerProviderStateMixin {
  AnimationController _controller;
  Animation<Offset> _offset;

  @override
  void initState() {
    super.initState();

    _controller = AnimationController(
      vsync: this,
      duration: Duration(milliseconds: 500),
    );
    _offset = Tween<Offset>(
      begin: Offset(0.0, 0.0),
      end: Offset(-1.0, 0.0),
    ).animate(_controller);
  }

  @override
  Widget build(BuildContext context) {
    return SlideTransition(
      position: _offset,
      child: buildContent(context),
    );
  }

  Widget buildContent(BuildContext context);

  Future push(Widget page) async {
    var result = Navigator.push(
      context,
      new SlideRightRoute(widget: page),
    );
    _controller.forward();
    await result;
    _controller.reverse();
  }
}

class SlideRightRoute extends PageRouteBuilder {
  final Widget widget;
  SlideRightRoute({this.widget})
      : super(
          transitionDuration: const Duration(milliseconds: 500),
          pageBuilder: (BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation) {
            return widget;
          },
          transitionsBuilder: (BuildContext context, Animation<double> animation, Animation<double> secondaryAnimation, Widget child) {
            return new SlideTransition(
              position: new Tween<Offset>(
                begin: const Offset(1.0, 0.0),
                end: Offset.zero,
              ).animate(animation),
              child: child,
            );
          },
        );
}
4

0 回答 0