How to make the entire page in flutter scrollable-CodePudding

I want to make the entire page in flutter scrollable, while the height in each element inside remains dynamic. Now the two Expanded elements have fixed height and are vertically scrollable - I want to make them extend to their regular height and be able to scroll down to the next element.

body: Scaffold(
    body: Column(
      children: <Widget>[
        Text(),
        IntrinsicHeight(   //This is fixed height and doesn't move
          child: Text(),
        ),
        new Divider(height: 0.1),
        Text(),
        Expanded(          //This is now vertically scrollable in its own box
            child: Text()
        ),
        Expanded(          //This is now vertically scrollable in its own box
            child: Text()
        ),
      ],
    ),
  ),

I tired several versions of wrapping the first column in SingleChildScrollView but for some reason it doesn't work.

CodePudding user response：

Wrap your column with a SingleChildScrollView(), so select Column than wrap it with a widget witch is SingleChildScrollView()

CodePudding user response：

Wrap your Column widget using IntrinsicHeight widget. Then wrap IntrinstHeight with SingleChildScrollView.

This work fine for me

  body: SingleChildScrollView(
    child: IntrinsicHeight(
      child: Column(
        children: <Widget>[
          Text("tes"),
          IntrinsicHeight(   //This is fixed height and doesn't move
            child: Text("tes"),
          ),
          new Divider(height: 0.1),
          Text("tes"),
          Expanded(          //This is now vertically scrollable in its own box
              child: Text("tes")
          ),
         Expanded(          //This is now vertically scrollable in its own box
              child: Text("tes")
          ),
        ],
      ),
    ),
  ),

Note: Put the code inside Scaffold body

CodePudding user response：

Try below code hope its helpful to you. Wrap your Column() inside IntrinsicHeight() widget,

Refere IntrinsicHeight here

Refere SingleChildScrollView here, this widget is used for Scrolling the Widget..

return Scaffold(
  body: SingleChildScrollView(
    child: IntrinsicHeight(
      child: Column(
        children: <Widget>[
          Text(
            'Try',
          ),
          IntrinsicHeight(
            child: Text(
              'Done',
            ),
          ),
          new Divider(height: 0.1),
          Text(
            'data',
          ),
          Expanded(
            child: Text(
              'Okk',
            ),
          ),
          Expanded(
            child: Text(
              'Yes',
            ),
          ),
        ],
      ),
    ),
  ),
);