我试图在屏幕上显示后立即通过平滑的滑动运动将小部件动画到其正常位置,但是,在实现下面的代码后,它不起作用,尝试了多种方法,例如更改 Transform.translate到 SlideTransition,我仍然没有得到任何结果。
我的代码有问题吗?我是不是忘记添加什么了?
class DiscoverCard extends StatefulWidget {
const DiscoverCard({
super.key,
required this.title,
required this.symbol,
required this.price,
required this.imagePath
});
final String title;
final String symbol;
final String imagePath;
final String price;
@override
State<DiscoverCard> createState() => _DiscoverCardState();
}
class _DiscoverCardState extends State<DiscoverCard>
with SingleTickerProviderStateMixin {
late AnimationController controller;
late Animation<Offset> slide;
@override
void initState() {
controller = AnimationController(
vsync: this,
duration: const Duration(milliseconds: 200)
);
slide = Tween<Offset>(
begin: const Offset(0.5, 0.0),
end: const Offset(0.0, 0.0)
).animate(controller);
super.initState();
}
@override
Widget build(BuildContext context) {
controller.forward();
return AnimatedBuilder(
animation: controller,
builder: (context, child) {
return Transform.translate(
offset: slide.value,
child: DiscoverCardUI(
widget: widget
),
);
}
);
}
}
我假设你没有注意到动画。
尝试增加动画的转换和持续时间。 https://api.flutter.dev/flutter/widgets/Transform/Transform.translate.html
偏移
0.5
看起来很小。
@override
void initState() {
controller = AnimationController(
vsync: this, duration: const Duration(milliseconds: 1000));
slide = Tween<Offset>(
begin: const Offset(12.5, 0.0), end: const Offset(0.0, 0.0))
.animate(controller);
super.initState();
}
我已经在 dartpad 上尝试过了。并且动画效果很好。