在 Flutter 测试中获取小部件的位置？

Posted 2023-02-23

【中文标题】在 Flutter 测试中获取小部件的位置？

【英文标题】：Getting the position of a widget in a Flutter test?

【发布时间】：2019-05-01 01:16:10

【问题描述】：

如何在 Flutter 测试中获取 Widget 的位置？理想情况下是小部件的中心，但左上角坐标也可以。

这是我的测试并尝试在屏幕上查找 Widget 位置的功能。

  testWidgets('Pin is in center of screen', (WidgetTester tester) async 
    await _setUp(tester); // Does setup
    final findPin = find.byKey('pin');
    final pinLocation = _getLocation(findPin.evaluate().first);
    print(ui.window.physicalSize);
    expect(pinLocation.dx, 1200.0);
    expect(pinLocation.dy, 900.0);
  );

Offset _getLocation(Element element) 
  return (element.findRenderObject() as RenderBox).localToGlobal(Offset.zero);

ui.window.physicalSize（其中ui 是dart:ui 包）的打印告诉我大小是Size(2400.0, 1800.0)。但是，当我在测试中设置这些中点时，我的测试失败了，说大小实际上是 395.0 和 305.0。我的小部件只有 30.0 x 30.0 大小，即使 395 +/- 30 也不等于 1200 范围内的任何东西。

在我的测试中，我将我的小部件包装在一个预定义宽度 (400) 和高度 (300) 的容器中，这与实际应用程序中的外观不同，但为了测试它更接近 - 给出一个195 和 155 的“中心”，应该是 200 和 150。

我正在测试的小部件（在代码中，而不是在我的 testWidgets 中使用额外的 Container）大约是：

return Center(
    child: Container(
      key: Key('pin'),
      height: 30.0, 
      width: 30.0, 
      color: Colors.pink,
   ),
);

【参考方案1】：

WidgetTester 有你要找的方法，例如：

tester.getCenter(findPin);

【讨论】：

我不知道为什么，但认为只有文档中的粗体方法可用。谢谢！我尝试了这个（特别是使用了findPin.at(0)），当我将小部件包裹在 400x300 容器周围时，得到了一个几乎正确的 210 中心。我本来预计中心是 200。我会做更多的摆弄。但是，当删除该容器时（因为我的真实应用没有它），我仍然得到 410 的 dx（而不是 ~1200）。

你好@Mary，欢迎来到 Stack Overflow！如果您发现此答案有帮助，请使用复选图标将其标记为解决方案。这将使人们在寻找其他地方之前更容易看到它是否有效，并且您可以获得声誉积分;-)