I already looked at these answers here but they are not working for me. I want LatestNewsList widget and the whole screen scroll together and not seperately.This is the code for the screen:

class Search extends StatelessWidget {
  final tab = new TabBar(tabs: <Tab>[
    new Tab(icon: new Icon(Icons.arrow_forward)),
    new Tab(icon: new Icon(Icons.arrow_downward)),
    new Tab(icon: new Icon(Icons.arrow_back)),
  ]);

  @override
  Widget build(BuildContext context) {
    final bloc = LatestNewsProvider.of(context);

    return DefaultTabController(
        length: 6,
        child: SingleChildScrollView(
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: <Widget>[
              Container(
                margin: EdgeInsets.only(
                  // right: 10,
                  left: 10,
                  top: 20,
                ),
                child: Row(
                  children: [
                    Container(
                      width: 32,
                      height: 32,
                      child: CircleAvatar(
                        backgroundImage: NetworkImage(
                            'https://thispersondoesnotexist.com/image'),
                      ),
                    ),
                    SizedBox(
                      width: 20,
                    ),
                    SearchBar(),
                  ],
                ),
              ),
              Container(
                child: TabBar(
                    isScrollable: true,
                    unselectedLabelColor: Colors.black,
                    labelColor: Colors.blue,
                    tabs: [
                      Tab(
                        text: "Latest",
                      ),
                      Tab(text: "programming"),
                      Tab(text: "general"),
                      Tab(text: "sports"),
                      Tab(text: "academia"),
                      Tab(text: "politics"),
                    ]),
              ),
              Container(
                //Add this to give height
                height: MediaQuery.of(context).size.height,
                child: TabBarView(children: [
                  Column(
                    children: [
                      StreamBuilder(
                        stream: bloc.searchedListBuilderStream,
                        builder: (context, snapshot) {
                          if (snapshot.hasData) {
                            return NewsListBuilder(snapshot);
                          } else if (snapshot.hasError) {
                            return Text('No results found');
                          }
                          bloc.fetchLatestNews();
                          return Expanded(
                              child: Column(
                            children: [
                              HorizontalSearchList(bloc, bloc.newsStream),
                              LatestNewsList(bloc, bloc.newsStream, 'Search'),
                            ],
                          ));
                        },
                      )
                    ],
                  ),
                  Column(
                    children: [
                      StreamBuilder(
                        stream: bloc.searchedListBuilderStream,
                        builder: (context, snapshot) {
                          if (snapshot.hasData) {
                            return NewsListBuilder(snapshot);
                          } else if (snapshot.hasError) {
                            return Text('No results found');
                          }
                          bloc.c1Fetch('programming');
                          return Expanded(
                              child: Column(
                            children: [
                              HorizontalSearchList(bloc, bloc.c1Stream),
                              LatestNewsList(bloc, bloc.c1Stream, 'Search'),
                            ],
                          ));
                        },
                      )
                    ],
                  ),
                  Column(
                    children: [
                      StreamBuilder(
                        stream: bloc.searchedListBuilderStream,
                        builder: (context, snapshot) {
                          if (snapshot.hasData) {
                            return NewsListBuilder(snapshot);
                          } else if (snapshot.hasError) {
                            return Text('No results found');
                          }
                          bloc.c2Fetch('general');
                          return Expanded(
                              child: Column(
                            children: [
                              HorizontalSearchList(bloc, bloc.c2Stream),
                              LatestNewsList(bloc, bloc.c2Stream, 'Search'),
                            ],
                          ));
                        },
                      )
                    ],
                  ),
                  Column(
                    children: [
                      StreamBuilder(
                        stream: bloc.searchedListBuilderStream,
                        builder: (context, snapshot) {
                          if (snapshot.hasData) {
                            return NewsListBuilder(snapshot);
                          } else if (snapshot.hasError) {
                            return Text('No results found');
                          }
                          bloc.c3Fetch('sports');
                          return Expanded(
                              child: Column(
                            children: [
                              HorizontalSearchList(bloc, bloc.c3Stream),
                              LatestNewsList(bloc, bloc.c3Stream, 'Search'),
                            ],
                          ));
                        },
                      )
                    ],
                  ),
                  Column(
                    children: [
                      StreamBuilder(
                        stream: bloc.searchedListBuilderStream,
                        builder: (context, snapshot) {
                          if (snapshot.hasData) {
                            return NewsListBuilder(snapshot);
                          } else if (snapshot.hasError) {
                            return Text('No results found');
                          }
                          bloc.c4Fetch('academia');
                          return Expanded(
                              child: Column(
                            children: [
                              HorizontalSearchList(bloc, bloc.c4Stream),
                              LatestNewsList(bloc, bloc.c4Stream, 'Search'),
                            ],
                          ));
                        },
                      )
                    ],
                  ),
                  Column(
                    children: [
                      StreamBuilder(
                        stream: bloc.searchedListBuilderStream,
                        builder: (context, snapshot) {
                          if (snapshot.hasData) {
                            return NewsListBuilder(snapshot);
                          } else if (snapshot.hasError) {
                            return Text('No results found');
                          }
                          bloc.c5Fetch('politics');
                          return Expanded(
                              child: Column(
                            children: [
                              HorizontalSearchList(bloc, bloc.c5Stream),
                              LatestNewsList(bloc, bloc.c5Stream, 'Search'),
                            ],
                          ));
                        },
                      )
                    ],
                  ),
                ]),
              ),
            ],
          ),
        ));
  }
}

LatestNewsList widget has a widget inside it and that widget has this code which is responsible for the listview building:

class NewsListBuilder extends StatelessWidget {
  final snapshot;

  NewsListBuilder(this.snapshot);

  @override
  Widget build(BuildContext context) {
    return Expanded(
        child: ListView.builder(
          shrinkWrap: true,
          physics: NeverScrollableScrollPhysics(),
      scrollDirection: Axis.vertical,
      padding: EdgeInsets.all(8),
      itemCount: snapshot.data.length,
      itemBuilder: (BuildContext context, int index) {
        return NewsListBuilderItems(snapshot, index);
      },
    ));
  }
}

I can not scroll further:

enter image description here


Solution 1: splaytreez

You should use slivers for more complex scroll pages like yours. Read more on them here: https://flutter.dev/docs/development/ui/advanced/slivers

I can provide you a simplified example of what I suppose you wanted to do (hope I understood you correctly):

import 'package:flutter/material.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Search(),
    );
  }
}

class Search extends StatefulWidget {
  @override
  _SearchState createState() => _SearchState();
}

class _SearchState extends State<Search> with SingleTickerProviderStateMixin {
  late final TabController _tabController;

  @override
  void initState() {
    // Make sure to set the correct length
    _tabController = TabController(length: 5, vsync: this);

    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return NestedScrollView(
      headerSliverBuilder: (context, innerBoxIsScrolled) {
        return [
          SliverAppBar(
            title: Container(height: 40, color: Colors.grey), // this can be the search bar
            bottom: TabBar(
              indicatorWeight: 3,
              indicatorPadding: EdgeInsets.symmetric(horizontal: 10, vertical: 0),
              controller: _tabController,
              tabs: <Widget>[
                Tab(text: "programming"),
                Tab(text: "general"),
                Tab(text: "sports"),
                Tab(text: "academia"),
                Tab(text: "politics"),
              ],
            ),
          ),
        ];
      },
      body: TabBarView(
        controller: _tabController,
        children: [
          /// here you put all your pages

          // Example of one page
          // You will need to wrap this in StreamBuilder as you do in the
          // original code
          CustomScrollView(
            slivers: [
              SliverList(
                delegate: SliverChildBuilderDelegate((context, index) {
                  return Container(
                    height: 400,
                    color: Colors.red.shade200,
                    margin: EdgeInsets.all(4),
                  );
                }),
              ),
            ],
          ),
          CustomScrollView(
            slivers: [
              SliverList(
                delegate: SliverChildBuilderDelegate((context, index) {
                  return Container(
                    height: 400,
                    color: Colors.green,
                    margin: EdgeInsets.all(4),
                  );
                }),
              ),
            ],
          ),
          CustomScrollView(
            slivers: [
              SliverList(
                delegate: SliverChildBuilderDelegate((context, index) {
                  return Container(
                    height: 400,
                    color: Colors.blue,
                    margin: EdgeInsets.all(4),
                  );
                }),
              ),
            ],
          ),
          CustomScrollView(
            slivers: [
              SliverList(
                delegate: SliverChildBuilderDelegate((context, index) {
                  return Container(
                    height: 400,
                    color: Colors.blue,
                    margin: EdgeInsets.all(4),
                  );
                }),
              ),
            ],
          ),
          CustomScrollView(
            slivers: [
              SliverList(
                delegate: SliverChildBuilderDelegate((context, index) {
                  return Container(
                    height: 400,
                    color: Colors.blue,
                    margin: EdgeInsets.all(4),
                  );
                }),
              ),
            ],
          ),
        ],
      ),
    );
  }
}