Flutter抽屉测试错误,显示“ RenderFlex的右侧188像素溢出”。

时间:2019-08-18 10:04:46

标签: flutter flutter-layout flutter-test

我正在为我的应用程序编写一些测试。目前,我一直在测试抽屉。在各种大小的仿真器上,它运行都没有问题(从240x432到1440x2960),但是当我尝试运行简单的测试时,会引发以下错误:

   ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
The following assertion was thrown during layout:
A RenderFlex overflowed by 188 pixels on the right.

The overflowing RenderFlex has an orientation of Axis.horizontal.
The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and
black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the
RenderFlex to fit within the available space instead of being sized to their natural size.
This is considered an error condition because it indicates that there is content that cannot be
seen. If the content is legitimately bigger than the available space, consider clipping it with a
ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex,
like a ListView.
The specific RenderFlex in question is: RenderFlex#1ae2c relayoutBoundary=up17 OVERFLOWING:
  creator: Row ← Center ← Padding ← Container ← IconTheme ← Builder ← Listener ← _GestureSemantics ←
    RawGestureDetector ← GestureDetector ← Listener ← InkWell ← ⋯
  parentData: offset=Offset(0.0, 0.0) (can use size)
  constraints: BoxConstraints(0.0<=w<=256.0, 0.0<=h<=Infinity)
  size: Size(256.0, 24.0)
  direction: horizontal
  mainAxisAlignment: start
  mainAxisSize: min
  crossAxisAlignment: center
  textDirection: ltr
  verticalDirection: down
◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤
════════════════════════════════════════════════════════════════════════════════════════════════════

在代码中,我将其范围缩小到了RaisedButton个。如果Row内的长度小于一定长度,则不会显示错误。

当我注释掉以下代码时,所有测试都可以正常运行。

          Padding(
          padding: EdgeInsets.symmetric(vertical: 32, horizontal: 16),
          child: Column(
            children: [
              FacebookSignInButton(
                onPressed: _fbLogin,
              ),
              GoogleSignInButton(
                onPressed: _googleLogin,
              )
            ],
            crossAxisAlignment: CrossAxisAlignment.stretch,
          ))

将其中的文本(“继续使用Facebook”,“使用Google登录”)更改为较短的内容也可以解决此问题。

测试(请注意,我目前只是在尝试不出错,一旦我弄清楚了,就会置入断言)

   testWidgets("Drawer",
        (WidgetTester tester) async {
          final GlobalKey<ScaffoldState> _scaffoldKey = GlobalKey<ScaffoldState>();
          BuildContext savedContext;
          await tester.pumpWidget(
            MaterialApp(
              home: Builder(
                builder: (BuildContext context) {
                  savedContext = context;
                  return Scaffold(
                    key: _scaffoldKey,
                    drawer: HomePageDrawer(),
                    body: Container(),
                  );
                },
              ),
            ),
          );
          await tester.pump(); // no effect
          _scaffoldKey.currentState.openDrawer();
          await tester.pump();
    });

0 个答案:

没有答案