flutter - Flutter应用程序无法渲染，出现错误 “Bottom overflowed by infinite pixels”

Question

我正在尝试将基于Firebase的登录合并到我的应用中。
我在这里关注教程-https://github.com/tattwei46/flutter_login_demo/blob/master/lib/pages/login_signup_page.dart

这是我的代码-

@override
  Widget build(BuildContext context) {
    _isIos = Theme.of(context).platform == TargetPlatform.iOS;
    return new Scaffold(
        appBar: new AppBar(
          title: new Text('Vroom - Exclusive carpool'),
        ),
        body: Stack(
          children: <Widget>[
            _showBody(),
            _showCircularProgress(),
          ],
        ));
  }

Widget _showBody() {
    return new Container(
        padding: EdgeInsets.all(16.0),
        child: new Form(
          key: _formKey,
          child: new ListView(
            shrinkWrap: true,
            children: <Widget>[
              _showLogo(),
              _showEmailInput(),
              _showPasswordInput(),
              _showPrimaryButton(),
              _showSecondaryButton(),
              _showErrorMessage(),
            ],
          ),
        ));
  }

  Widget _showCircularProgress(){
    if (_isLoading) {
      return Center(child: CircularProgressIndicator());
    } return Container(height: 100,);
  }

  Widget _showLogo() {
    return new Hero(
      tag: 'hero',
      child: Padding(
        padding: EdgeInsets.fromLTRB(0.0, 70.0, 0.0, 0.0),
        child: CircleAvatar(
          backgroundColor: Colors.transparent,
          radius: 48.0,
          child: Image.asset('assets/flutter-icon.png'),
        ),
      ),
    );
  }

  Widget _showEmailInput() {
    return Padding(
      padding: const EdgeInsets.fromLTRB(0.0, 15.0, 0.0, 0.0),
      child: new TextFormField(
        maxLines: 1,
        keyboardType: TextInputType.emailAddress,
        autofocus: false,
        decoration: new InputDecoration(
            hintText: 'Email',
            icon: new Icon(
              Icons.mail,
              color: Colors.grey,
            )),
            validator: (value) {
              if (value.isEmpty) {
                return 'Please enter email address!';
              }
              if (EmailValidator.validate(value)) {
                return 'Please enter a valid email address!';
              }
              return null;
            },
        onSaved: (value) => _email = value.trim(),
      ),
    );
  }

  Widget _showPasswordInput() {
    return Padding(
      padding: const EdgeInsets.fromLTRB(0.0, 15.0, 0.0, 0.0),
      child: new TextFormField(
        maxLines: 1,
        obscureText: true,
        autofocus: false,
        decoration: new InputDecoration(
            hintText: 'Password',
            icon: new Icon(
              Icons.lock,
              color: Colors.grey,
            )),
        validator: (value) => value.isEmpty ? 'Please enter your password' : null,
        onSaved: (value) => _password = value.trim(),
      ),
    );
  }

  Widget _showSecondaryButton() {
    return new FlatButton(
      child: _formMode == FormMode.LOGIN
          ? new Text('Create an account',
              style: new TextStyle(fontSize: 18.0, fontWeight: FontWeight.w300))
          : new Text('Have an account? Sign in',
              style:
                  new TextStyle(fontSize: 18.0, fontWeight: FontWeight.w300)),
      onPressed: _formMode == FormMode.LOGIN
          ? _changeFormToSignUp
          : _changeFormToLogin,
    );
  }

  Widget _showPrimaryButton() {
    return new Padding(
        padding: EdgeInsets.fromLTRB(0.0, 45.0, 0.0, 0.0),
        child: SizedBox(
          height: 40.0,
          child: new RaisedButton(
            elevation: 5.0,
            shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(30.0)),
            color: Colors.blue,
            child: _formMode == FormMode.LOGIN
                ? new Text('Login',
                    style: new TextStyle(fontSize: 20.0, color: Colors.white))
                : new Text('Create account',
                    style: new TextStyle(fontSize: 20.0, color: Colors.white)),
            onPressed: _validateAndSubmit,
          ),
        ));
  }

Widget _showErrorMessage() {
    if (_errorMessage.length > 0 && _errorMessage != null) {
      return new Text(
        _errorMessage,
        style: TextStyle(
            fontSize: 13.0,
            color: Colors.red,
            height: 1.0,
            fontWeight: FontWeight.w300),
      );
    } else {
      return null;
    }
  }

我尝试从 Stack中删除 Scaffold，并一直在尝试将旧的Widgets放入表单中，但似乎无法修复。

这是堆栈跟踪-

flutter: ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
flutter: The following assertion was thrown during performLayout():
flutter: FlutterError contained multiple error summaries.
flutter: All FlutterError objects should have only a single short (one line) summary description of the
flutter: problem that was detected.
flutter: Malformed FlutterError:
flutter:   RenderCustomMultiChildLayoutBox object was given an infinite size during layout.
flutter:   This probably means that it is a render object that tries to be as big as possible, but it was put
flutter:   inside another render object that allows its children to pick their own size.
flutter:   RenderCustomMultiChildLayoutBox object was given an infinite size during layout.
flutter:   This probably means that it is a render object that tries to be as big as possible, but it was put
flutter:   inside another render object that allows its children to pick their own size.
flutter:   The nearest ancestor providing an unbounded height constraint is: RenderFlex#6fcb6 relayoutBoundary=up2 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE OVERFLOWING:
flutter:     needs compositing
flutter:     creator: Column ← Center ← MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ← CustomMultiChildLayout ←
flutter:       AnimatedBuilder ← DefaultTextStyle ← AnimatedDefaultTextStyle ← _InkFeatures-[GlobalKey#c780d ink
flutter:       renderer] ← NotificationListener<LayoutChangedNotification> ← PhysicalModel ←
flutter:       AnimatedPhysicalModel ← ⋯
flutter:     parentData: offset=Offset(0.0, 0.0) (can use size)
flutter:     constraints: BoxConstraints(0.0<=w<=414.0, 0.0<=h<=796.0)
flutter:     size: Size(414.0, 796.0)
flutter:     direction: vertical
flutter:     mainAxisAlignment: start
flutter:     mainAxisSize: max
flutter:     crossAxisAlignment: center
flutter:     verticalDirection: down
flutter:   The constraints that applied to the RenderCustomMultiChildLayoutBox were:
flutter:     BoxConstraints(0.0<=w<=414.0, 0.0<=h<=Infinity)
flutter:   The exact size it was given was:
flutter:     Size(414.0, Infinity)
flutter:   See https://flutter.dev/docs/development/ui/layout/box-constraints for more information.
flutter:
flutter: The malformed error has 2 summaries.
flutter: Summary 1: RenderCustomMultiChildLayoutBox object was given an infinite size during layout.
flutter: Summary 2: RenderCustomMultiChildLayoutBox object was given an infinite size during layout.
flutter:
flutter: This error should still help you solve your problem, however please also report this malformed error
flutter: in the framework by filing a bug on GitHub:
flutter:   https://github.com/flutter/flutter/issues/new?template=BUG.md
flutter:
flutter: When the exception was thrown, this was the stack:
[38;5;244mflutter: #0      new FlutterError.fromParts.<anonymous closure>[39;49m
[38;5;244mflutter: #1      new FlutterError.fromParts[39;49m
[38;5;244mflutter: #2      RenderBox.debugAssertDoesMeetConstraints.<anonymous closure>[39;49m
[38;5;244mflutter: #3      RenderBox.debugAssertDoesMeetConstraints[39;49m
[38;5;244mflutter: #4      RenderBox.size=.<anonymous closure>[39;49m
[38;5;244mflutter: #5      RenderBox.size=[39;49m
[38;5;244mflutter: #6      RenderCustomMultiChildLayoutBox.performLayout[39;49m
[38;5;244mflutter: #7      RenderObject.layout[39;49m
[38;5;244mflutter: #8      _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #9      RenderObject.layout[39;49m
[38;5;244mflutter: #10     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #11     _RenderCustomClip.performLayout[39;49m
[38;5;244mflutter: #12     RenderObject.layout[39;49m
[38;5;244mflutter: #13     RenderFlex.performLayout[39;49m
[38;5;244mflutter: #14     RenderObject.layout[39;49m
[38;5;244mflutter: #15     RenderPositionedBox.performLayout[39;49m
[38;5;244mflutter: #16     RenderObject.layout[39;49m
[38;5;244mflutter: #17     MultiChildLayoutDelegate.layoutChild[39;49m
[38;5;244mflutter: #18     _ScaffoldLayout.performLayout[39;49m
[38;5;244mflutter: #19     MultiChildLayoutDelegate._callPerformLayout[39;49m
[38;5;244mflutter: #20     RenderCustomMultiChildLayoutBox.performLayout[39;49m
[38;5;244mflutter: #21     RenderObject.layout[39;49m
[38;5;244mflutter: #22     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #23     RenderObject.layout[39;49m
[38;5;244mflutter: #24     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #25     _RenderCustomClip.performLayout[39;49m
[38;5;244mflutter: #26     RenderObject.layout[39;49m
[38;5;244mflutter: #27     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #28     RenderObject.layout[39;49m
[38;5;244mflutter: #29     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #30     RenderObject.layout[39;49m
[38;5;244mflutter: #31     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #32     RenderObject.layout[39;49m
[38;5;244mflutter: #33     RenderStack.performLayout[39;49m
[38;5;244mflutter: #34     RenderObject.layout[39;49m
[38;5;244mflutter: #35     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #36     RenderObject.layout[39;49m
[38;5;244mflutter: #37     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #38     RenderObject.layout[39;49m
[38;5;244mflutter: #39     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #40     RenderObject.layout[39;49m
[38;5;244mflutter: #41     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #42     RenderObject.layout[39;49m
[38;5;244mflutter: #43     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #44     RenderObject.layout[39;49m
[38;5;244mflutter: #45     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #46     RenderOffstage.performLayout[39;49m
[38;5;244mflutter: #47     RenderObject.layout[39;49m
[38;5;244mflutter: #48     RenderStack.performLayout[39;49m
[38;5;244mflutter: #49     RenderObject.layout[39;49m
[38;5;244mflutter: #50     __RenderTheatre&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #51     RenderObject.layout[39;49m
[38;5;244mflutter: #52     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #53     RenderObject.layout[39;49m
[38;5;244mflutter: #54     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #55     RenderObject.layout[39;49m
[38;5;244mflutter: #56     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #57     RenderObject.layout[39;49m
[38;5;244mflutter: #58     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #59     RenderObject.layout[39;49m
[38;5;244mflutter: #60     _RenderProxyBox&RenderBox&RenderObjectWithChildMixin&RenderProxyBoxMixin.performLayout[39;49m
[38;5;244mflutter: #61     RenderObject.layout[39;49m
[38;5;244mflutter: #62     RenderView.performLayout[39;49m
[38;5;244mflutter: #63     RenderObject._layoutWithoutResize[39;49m
[38;5;244mflutter: #64     PipelineOwner.flushLayout[39;49m
[38;5;244mflutter: #65     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding.drawFrame[39;49m
[38;5;244mflutter: #66     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding&WidgetsBinding.drawFrame[39;49m
[38;5;244mflutter: #67     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding&PaintingBinding&SemanticsBinding&RendererBinding._handlePersistentFrameCallback[39;49m
[38;5;244mflutter: #68     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding._invokeFrameCallback[39;49m
[38;5;244mflutter: #69     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.handleDrawFrame[39;49m
[38;5;244mflutter: #70     _WidgetsFlutterBinding&BindingBase&GestureBinding&ServicesBinding&SchedulerBinding.scheduleWarmUpFrame.<anonymous closure>[39;49m
[38;5;244mflutter: #72     _Timer._runTimers  (dart:isolate-patch/timer_impl.dart:382:19)[39;49m
[38;5;244mflutter: #73     _Timer._handleMessage  (dart:isolate-patch/timer_impl.dart:416:5)[39;49m
[38;5;244mflutter: #74     _RawReceivePortImpl._handleMessage  (dart:isolate-patch/isolate_patch.dart:172:12)[39;49m
flutter: (elided one frame from package dart:async-patch)
flutter:
flutter: The following RenderObject was being processed when the exception was fired: RenderCustomMultiChildLayoutBox#92e49 relayoutBoundary=up5 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE:
flutter:   needs compositing
flutter:   creator: CustomMultiChildLayout ← AnimatedBuilder ← DefaultTextStyle ← AnimatedDefaultTextStyle ←
flutter:     _InkFeatures-[GlobalKey#2e3cd ink renderer] ← NotificationListener<LayoutChangedNotification> ←
flutter:     PhysicalModel ← AnimatedPhysicalModel ← Material ← PrimaryScrollController ← _ScaffoldScope ←
flutter:     Scaffold ← ⋯
flutter:   parentData: <none> (can use size)
flutter:   constraints: BoxConstraints(0.0<=w<=414.0, 0.0<=h<=Infinity)
flutter:   size: Size(414.0, Infinity)
flutter: This RenderObject had the following descendants (showing up to depth 5):
flutter:     child 1: RenderStack#5c359 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:       child 1: RenderPadding#4dbd0 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:         child: _RenderScrollSemantics#fa036 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:           child: RenderPointerListener#f9d94 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:             child: RenderSemanticsGestureHandler#0811d NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:       child 2: RenderConstrainedBox#bfa84 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:         child: RenderLimitedBox#5e655 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:           child: RenderConstrainedBox#09e70 NEEDS-LAYOUT NEEDS-PAINT
flutter:     child 2: RenderConstrainedBox#0af7b NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:       child: RenderSemanticsAnnotations#392dd NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:         child: RenderAnnotatedRegion<SystemUiOverlayStyle>#1a056 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
Reloaded 2 of 460 libraries in 413ms.
flutter:           child: RenderPhysicalModel#1c1a6 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:             child: _RenderInkFeatures#e54f0 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:     child 3: RenderStack#00dd6 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:       child 1: RenderTransform#32881 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:         child: RenderTransform#f74bd NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter:     child 4: RenderPointerListener#c61fe NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
flutter: ════════════════════════════════════════════════════════════════════════════════════════════════════
flutter: Another exception was thrown: FlutterError contained multiple error summaries.
flutter: Another exception was thrown: FlutterError contained multiple error summaries.
flutter: Another exception was thrown: A RenderFlex overflowed by Infinity pixels on the bottom.

编辑:添加了 _showErrorMessage()。

Answer 1

输出:



由于您的代码包含许多我无法引用的变量。我删除了所有这些并相应地生成了布局。

我注意到的一个错误是您是returning null;中的_buildErrorWidget()，而不是null，您可以return Container();
这是完整的工作代码。

@override
Widget build(BuildContext context) {
  return new Scaffold(
    appBar: new AppBar(
      title: new Text('Vroom - Exclusive carpool'),
    ),
    body: Stack(
      children: <Widget>[
        _showBody(),
        _showCircularProgress(),
      ],
    ),
  );
}

Widget _showBody() {
  return new Container(
    padding: EdgeInsets.all(16.0),
    child: new Form(
      child: new ListView(
        shrinkWrap: true,
        children: <Widget>[
          _showLogo(),
          _showEmailInput(),
          _showPasswordInput(),
          _showPrimaryButton(),
          _showSecondaryButton(),
          _showErrorMessage(),
        ],
      ),
    ),
  );
}

bool _isLoading = false;

Widget _showCircularProgress() {
  if (_isLoading) {
    return Center(child: CircularProgressIndicator());
  }
  return Container(
    height: 100,
  );
}

Widget _showLogo() {
  return new Hero(
    tag: 'hero',
    child: Padding(
      padding: EdgeInsets.fromLTRB(0.0, 90.0, 0.0, 0.0),
      child: CircleAvatar(
        backgroundColor: Colors.transparent,
        radius: 48.0,
        child: Placeholder(),
      ),
    ),
  );
}

Widget _showEmailInput() {
  return Padding(
    padding: const EdgeInsets.fromLTRB(0.0, 15.0, 0.0, 0.0),
    child: new TextFormField(
      maxLines: 1,
      keyboardType: TextInputType.emailAddress,
      autofocus: false,
      decoration: new InputDecoration(
        hintText: 'Email',
        icon: new Icon(
          Icons.mail,
          color: Colors.grey,
        ),
      ),
    ),
  );
}

Widget _showPasswordInput() {
  return Padding(
    padding: const EdgeInsets.fromLTRB(0.0, 15.0, 0.0, 0.0),
    child: new TextFormField(
      maxLines: 1,
      obscureText: true,
      autofocus: false,
      decoration: new InputDecoration(
          hintText: 'Password',
          icon: new Icon(
            Icons.lock,
            color: Colors.grey,
          )),
      validator: (value) => value.isEmpty ? 'Please enter your password' : null,
    ),
  );
}

Widget _showSecondaryButton() {
  return FlatButton(
    child: Text("Secondary button"),
    onPressed: () {},
  );
}

Widget _showPrimaryButton() {
  return new Padding(
    padding: EdgeInsets.fromLTRB(0.0, 45.0, 0.0, 0.0),
    child: SizedBox(
      height: 40.0,
      child: new RaisedButton(
        elevation: 5.0,
        shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(30.0)),
        color: Colors.blue,
        onPressed: (){},
        child: Text("Primary Button"),
      ),
    ),
  );
}

Widget _showErrorMessage() {
  return Text("This is your error message.");
}