Skip to content

Scrolling

Mattia Crovero edited this page Jan 7, 2019 · 2 revisions

Follow these steps on the example

To enable the scrolling inside our bottom sheet we need to pass the scrolling management to the widget.

First create the scroll controller in the state of your stateful widget.

ScrollController _scrollController = ScrollController();

Then pass it to the scroll element you want to include in the bottom sheet (as in the example)

Widget _getUpperLayer() {
  return Container(
    decoration: BoxDecoration(
        color: Colors.cyan
    ),
    child: ListView.builder(
      physics: NeverScrollableScrollPhysics(),
      controller: _scrollController,
      itemBuilder: (BuildContext context, int index) {
        return ListTile(title: Text("Item $index"),);
      },
      itemCount: 100
    ),
  );
}

As you can see the physics are set to NeverScrollableScrollPhysics(). This is mandatory because we're passing the scroll management to the bottom sheet.

Finally pass the ScrollController to the rubber bottom sheet widget.

RubberBottomSheet(
    scrollController: _scrollController,
    lowerLayer: _getLowerLayer(),
    upperLayer: _getUpperLayer(),
    animationController: _controller,
)
Clone this wiki locally