Flutter/Dart - A RenderFlex overflowed by 99804 pixels on the bottom

Question

Can anybody see why I'm getting this error on the first child: Column? I'm using a stack in my build. and tried wrapping each widget in a Flexible widget but can't figure out where the code is overflowing. The screen flashes the telltale yellow/black renderflex lines for just a second but then seems to render just fine. The messages in the console are annoying though as is the little yellow/black flash at the beginning.

A RenderFlex overflowed by 99804 pixels on the bottom.
The relevant error-causing widget was: 
  Column file:///E:/FlutterProjects/myproject/lib/builders/CustomPageView.dart:47:26

Here's the code. Line 47 is the first child: column.

class _CustomPageViewState extends State<CustomPageView> {
  Widget build(context) {
    return PageView.builder(
      itemCount: widget.speakcrafts.length,
      itemBuilder: (context, int currentIndex) {
        return createViewItem(widget.speakcrafts[currentIndex], context);
      },
    );
  }

    Widget createViewItem(SpeakContent speakcraft, BuildContext context) {
          var contsize = MediaQuery.of(context).size.width * 0.60;
        var contHeightsize = MediaQuery.of(context).size.height;
    
    return Stack(
  children: <Widget>[
    Container(
      color: Colors.black12,
      child: Column(
        children: <Widget>[
          Padding(
            padding: const EdgeInsets.all(20.0),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Image.network(
                  speakcraft.gavatar,
                  height: contsize,
                  width: contsize,
                ),
                PlayerWidget2(url: kUrl),
              ],
            ),
          ),
        ],
      ),
    ),
  ],
);

And here's the full error code with chunhunghan's ConstrainedBox suggestion;

A RenderFlex overflowed by 99325 pixels on the right.
The relevant error-causing widget was: 
  Row file:///E:/FlutterProjects/speakoholic/lib/builders/CustomPageView.dart:121:25
The specific RenderFlex in question is: RenderFlex#d5393 relayoutBoundary=up8 OVERFLOWING
  parentData: offset=Offset(0.0, 556.9); flex=null; fit=null (can use size)
  constraints: BoxConstraints(0.0<=w<=674.9, 0.0<=h<=Infinity)
  size: Size(674.9, 100000.0)
  direction: horizontal
  mainAxisAlignment: center
  mainAxisSize: max
  crossAxisAlignment: center
  textDirection: ltr
  verticalDirection: down
  child 1: RenderErrorBox#d3900
    parentData: offset=Offset(0.0, 0.0); flex=null; fit=null (can use size)
    constraints: BoxConstraints(unconstrained)
    size: Size(100000.0, 100000.0)
════════════════════════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════════════════════════
A RenderFlex overflowed by 100385 pixels on the bottom.
The relevant error-causing widget was: 
  Column file:///E:/FlutterProjects/speakoholic/lib/builders/CustomPageView.dart:49:28

Answer 1

It turns out I had to follow the error further down the widget tree of this widget;

child: PlayerWidget2(url: kUrl))

Within PlayerWidget2 was a path that was null prior to a PageViewBuilder being built. This threw a null path error which lead to the renderflex error. Once built, the null was filled in with a path. So in order to get rid of the errors I simply added a default path to the widget to fill in the null until the PageViewBuilder was built.

Answer 2

you can wrap your whole body content as a child of SingleChildScrollView SinglechildScrollView widget which may help you to overcome from this issue,or you can also make use of listview which can arrange list of widgets properly ListView