Flutter - SingleScrollView isn't scrolling inside Stack/Column

Question

I have a flutter application with two screens. Screen1: StatefulWidget with BottomNavigationBar. I'm using this as my "main" screen and I want to load different widgets inside this, depending on which button in the BottomNavigationBar was clicked (for example Screen2).

Screen2: Multiple TextFields and Buttons listed vertically (all inside SingleScrollView). Unfortunately the ScrollView isn't scrolling.

Screen1:

@override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomPadding: false,
      body: new Stack(
        children: <Widget>[
          new Container(
            decoration: new BoxDecoration(
                gradient: LinearGradient(
                    begin: Alignment.topCenter,
                    end: Alignment.bottomCenter,
                    stops: [0,0.4,1],
                    colors: [
                      Color(0xFF0A9B8A),
                      Color(0xFF0A9B8A),
                      Color(0xFF6FA7A1),
                    ]
                )
            ),
          ),
          new Column(
            children: <Widget>[
              new Container(
                alignment: Alignment.topCenter,
                padding: new EdgeInsets.only(top: 35, left: 50, right: 50),
                child: Image.asset('assets/images/123.png', fit: BoxFit.cover, height: 30.0,),
              ),
              _pages[_curIndex],
            ],
          )
        ],
      ),

Screen2:

@override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      scrollDirection: Axis.vertical,
      child: new Column(
        children: <Widget>[
          Padding(padding: EdgeInsets.only(top: 75)),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              FlatButton(
                  child: Column(
                    children: <Widget>[
                      Image.asset("assets/images/abc.png", height: 100),
                      Text("Bild auswählen", style: TextStyle(color: Colors.white, fontSize: 18))
                    ],
                  )
              )
            ],
          ),
          Padding(padding: EdgeInsets.only(top: 40, left: 40, right: 40),
            child: TextField(
              textAlign: TextAlign.center,
              cursorColor: Colors.grey,
              decoration: new InputDecoration(
                enabledBorder: new UnderlineInputBorder(
                  borderSide: new BorderSide(
                      color: Colors.white
                  ),
                ),
                focusedBorder: new UnderlineInputBorder(
                  borderSide: new BorderSide(
                      color: Colors.white
                  ),
                ),
                hintText: 'Titel',
              ),
            ),
          ),
          Padding(
            padding: EdgeInsets.only(top: 20, left: 40, right: 40),
            child: TextField(
              textAlign: TextAlign.center,
              cursorColor: Colors.grey,
              decoration: new InputDecoration(
                enabledBorder: new UnderlineInputBorder(
                  borderSide: new BorderSide(
                      color: Colors.white
                  ),
                ),
                focusedBorder: new UnderlineInputBorder(
                  borderSide: new BorderSide(
                      color: Colors.white
                  ),
                ),
                hintText: 'Beschreibung',
              ),
            ),
          ),

This screen just consists of multiple different TextFields and Buttons. I've not listed them all here, because I think they are unnecessary for my problem.

So my SingleScrollView in Screen2 is not scrolling and it is too large for my screen. I also get following error:

I/flutter (21813): ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
I/flutter (21813): The following message was thrown during layout:
I/flutter (21813): A RenderFlex overflowed by 61 pixels on the bottom.
I/flutter (21813): 
I/flutter (21813): The overflowing RenderFlex has an orientation of Axis.vertical.
I/flutter (21813): The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and
I/flutter (21813): black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
I/flutter (21813): Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the
I/flutter (21813): RenderFlex to fit within the available space instead of being sized to their natural size.
I/flutter (21813): This is considered an error condition because it indicates that there is content that cannot be
I/flutter (21813): seen. If the content is legitimately bigger than the available space, consider clipping it with a
I/flutter (21813): ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex,
I/flutter (21813): like a ListView.
I/flutter (21813): The specific RenderFlex in question is:
I/flutter (21813):   RenderFlex#b781d relayoutBoundary=up2 OVERFLOWING
I/flutter (21813):   creator: Column ← Stack ← MediaQuery ← LayoutId-[<_ScaffoldSlot.body>] ← CustomMultiChildLayout ←
I/flutter (21813):   AnimatedBuilder ← DefaultTextStyle ← AnimatedDefaultTextStyle ← _InkFeatures-[GlobalKey#53b39 ink
I/flutter (21813):   renderer] ← NotificationListener<LayoutChangedNotification> ← PhysicalModel ←
I/flutter (21813):   AnimatedPhysicalModel ← ⋯

Answer 1

You should wrap your scrollView widget with Expanded, which will size it exactly to fit the rest of the screen. In your column:

Column(
   children: Widget[
        child1,
        child2,
        Expanded(
        child: ScrollViewWidget()
           )
          ]
        )

That's what most likely to be stopping your scrolling.