[英]Flutter: custom transition (PageRouteBuilder) disables Hero animations
I am currently trying to make a custom transition using PageRouteBuilder
.我目前正在尝试使用PageRouteBuilder
进行自定义转换。 However, when i use it, my Hero animations stop working.但是,当我使用它时,我的英雄动画停止工作。
Note: It works with other transitions, even other custom ones.注意:它适用于其他过渡,甚至其他自定义过渡。
EnterExitRoute.dart EnterExitRoute.dart
import 'package:flutter/material.dart';
class EnterExitRoute extends PageRouteBuilder {
final Widget enterPage;
final Widget exitPage;
EnterExitRoute({this.exitPage, this.enterPage})
: super(
pageBuilder: (
BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
) {
return enterPage;
} ,
transitionsBuilder: (
BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
Widget child,
) {
return Stack(
children: <Widget>[
SlideTransition(
position: new Tween<Offset>(
begin: const Offset(0.0, 0.0),
end: const Offset(-1.0, 0.0),
).animate(animation),
child: exitPage,
),
SlideTransition(
position: new Tween<Offset>(
begin: const Offset(1.0, 0.0),
end: Offset.zero,
).animate(animation),
child: enterPage,
)
],
);
}
);
}
My guess is that Hero animation cannot keep up with SlideTransition
.我的猜测是 Hero 动画跟不上SlideTransition
。
Any ideas on how to fix this ?有想法该怎么解决这个吗 ?
As pskink said, the issue was not using the child
ref.正如 pskink 所说,问题不在于使用child
引用。
Here is the updated & working code这是更新后的工作代码
import 'package:flutter/material.dart';
class EnterExitRoute extends PageRouteBuilder {
final Widget enterPage;
final Widget exitPage;
EnterExitRoute({this.exitPage, this.enterPage})
: super(
pageBuilder: (
BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
) {
return enterPage;
} ,
transitionsBuilder: (
BuildContext context,
Animation<double> animation,
Animation<double> secondaryAnimation,
Widget child,
) {
var curvedAnimation = CurvedAnimation(
parent: animation,
curve: Curves.ease,
);
return Stack(
children: <Widget>[
SlideTransition(
position: new Tween<Offset>(
begin: const Offset(0.0, 0.0),
end: const Offset(-1.0, 0.0),
).animate(curvedAnimation),
child: exitPage,
),
SlideTransition(
position: new Tween<Offset>(
begin: const Offset(1.0, 0.0),
end: Offset.zero,
).animate(curvedAnimation),
child: child,
)
],
);
}
);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.