Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flutter 2 Streambuilders in Column

I have 2 streambuilders that I want to display, both with a Listview builder inside them. I want to put both those streambuilders in a scrollabe column but it just won't work. I tried wrapping them in an Expanded or Flexible and I just can't figure it out. The problem when using the expanded widget is that even if the widget doesn't have any children, it still takes in a big part of the screen. When for example streambuilder 1 doesn't have data, it still uses a proportion of the screen. Thanks in advance!

This is my code briefly:

SingleChildScrollView(
      child: Column(
        children: [
          Expanded(
            child: StreamBuilder(
              stream: stream1,
              builder: (context, snapshot) {
                return ListView.builder();
              },
            ),
          ),
          Expanded(
            child: StreamBuilder(
              stream: stream2,
              builder: (context, snapshot) {
                return ListView.builder();
              },
            ),
          ),
        ],
      ),
    ),
like image 940
Dewaeq Avatar asked Nov 06 '25 14:11

Dewaeq


1 Answers

SingleChildScrollView(
  child: Column(
    mainAxisSize: MainAxisSize.min,
    children: <Widget>[
      Expanded(
        child: StreamBuilder(
          stream: stream1,
          builder: (context, snapshot) {
            return  ListView(
              physics: NeverScrollableScrollPhysics(),
              shrinkWrap: true,
              children: firstList(),
            ),
          },
        ),
      ),
      Expanded(
        child: StreamBuilder(
          stream: stream2,
          builder: (context, snapshot) {
            return  ListView(
             physics: NeverScrollableScrollPhysics(),
             shrinkWrap: true,
             children: secondList(),
           ),
          },
        ),
      ),
    ],
  ),
)

You can make the ListView widget never scrollable by setting physics property to physics: NeverScrollableScrollPhysics(), and With shrinkWrap: true, you can change this behavior so that the ListView only occupies the space it needs (it will still scroll when there more items). its make two diferent StreamBuilder widget in a single scrollable.

like image 103
shirsh shukla Avatar answered Nov 08 '25 14:11

shirsh shukla



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!