Flutter 动画在用户单击时停止，但不发生导航。如何使卡片在动画期间可点击以触发导航？

Question

我在 Flutter 中遇到一个问题，用户在动画期间单击它会停止动画但无法触发导航。具体来说，我有带有动画效果的卡片（从右向左滑动），并且我希望它们在第一次交互时可单击，即使在动画期间也是如此。

我怎样才能实现这个目标？我尝试在用户单击时暂停动画，但没有发生导航。任何解决此问题的见解或替代方法将不胜感激。谢谢！

Answer 1

在 Flutter 集成测试中，tester.fling 不会直接在像 ClipRRect 这样的 widget 上模拟 fling 动画。它主要设计用于模拟可滚动小部件（如 ListView、GridView 等）上的滑动手势。但是，您可以通过组合使用 tester.drag 和 tester.pump 来实现类似的效果。

以下是如何修改测试代码以在 ClipRRect 中模拟 GoogleMap 小部件上的 fling 动画：

以下代码通过拖动 GoogleMap 小部件来模拟 fling 动画。根据需要调整参数以满足您的特定动画要求。

await tester.tap(find.byKey(const Key("create_plate")));
await tester.pumpAndSettle();

// Assuming your widget tree is fully built and animations are complete

final findPlateKey = find.byKey(const Key('find_plate_key'));

// Simulate starting point
await tester.startGesture(tester.getCenter(findPlateKey));
await tester.pump();

// Simulate fling movement
await tester.drag(findPlateKey, const Offset(100, 100));
await tester.pump();

// Simulate ending the fling gesture
await tester.pump(const Duration(seconds: 2)); // Adjust duration as per your requirement

// Ensure the animation is complete
await tester.pumpAndSettle();

// Add your expectations here