我是Flutter和Dart的新手。希望能获得一些有关我被困的教程练习的指南。
我正在关注Flutter Codelab https://codelabs.developers.google.com/codelabs/flutter/index.html?index=..%2F..index#6,并且能够执行所有操作。
有一项练习要求我们做到这一点
通过将Container包装在FadeTransition小部件中而不是SizeTransition中,来创建淡入动画效果。
下面的代码
@override
Widget build(BuildContext context) {
return new SizeTransition(
sizeFactor: new CurvedAnimation(
parent: animationController, curve: Curves.easeOut),
axisAlignment: 0.0,
child: new Container(
// ... other codes ...
),
);
}
所以我更改为FadeTransition,它需要类型为opacity
的{{1}}
Animation<Double>
如何创建或发送@override
Widget build(BuildContext context) {
return new FadeTransition(
opacity: animation
child: new Container(
// ... other codes ...
),
);
}
? (上面的代码将无法识别animation
。)
答案 0 :(得分:0)
通过参考https://proandroiddev.com/getting-your-hands-dirty-with-flutter-basic-animations-6b9f21fa7d17找到答案并进行相应的修改。
要拥有FadeTransition
,基本上只需替换
opacity: animation
使用
opacity: new CurvedAnimation(parent: animationController, curve: Curves.easeIn),
这并不理想,因为每次插入消息时,它都会创建一个新的CurveAnimation
,但是为了简洁的解决方案,我这样做了。
答案 1 :(得分:0)
您可以尝试
opacity: Tween<double>(
begin: 0.0,
end: 1.0,
).animate(animationController),
CurvedAnimation
用于非线性动画。
在这里https://flutter.dev/docs/development/ui/animations/tutorial
查看更多详细信息