flutter - Flutter:自定义过渡(PageRouteBuilder)禁用英雄动画
问题描述
我目前正在尝试使用PageRouteBuilder
. 但是,当我使用它时,我的英雄动画停止工作。
注意:它适用于其他转换,甚至其他自定义转换。
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,
)
],
);
}
);
}
我的猜测是英雄动画跟不上SlideTransition
。
有想法该怎么解决这个吗 ?
解决方案
正如 pskink 所说,问题不在于使用child
ref。
这是更新后的工作代码
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,
)
],
);
}
);
}
推荐阅读
- python-3.x - 如何将默认烧瓶记录器输出更改为 json 记录处理程序
- flutter - 在 Flutter 中按下/离开时,TextField 会重新加载 FutureBuilder
- haskell - Liquid Haskell 中函数“map”的正确合约是什么?
- mouseevent - How do i prevent mouse and touch events from trigger for DisplayObjects below a backdrop
- c - 使用外部控制格式字符串的漏洞
- angular - Angular 7 文件 '../src/types/@angular/common.d.ts' 不是模块
- javascript - 查找所有重复的 id 并添加唯一键
- sql-server - 使用触发器替换公式中的值
- c# - CORS 实现显示不允许用于 POST 请求的方法
- android - 如何以编程方式将颜色应用于应用程序主题?