Home > Back-end >  ListView widget is not scrolling
ListView widget is not scrolling

Time:09-03

I am making a simple app.The post widget is not scrolling.I have used ListView widget and also given shrinkWrap property to true. Only the widget above the post is scroll but the post widget is not scrolling.

postbar.dart

  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        
          ],
        )
      ],
    );
  }

home.dart

class _homeState extends State<home> {
  @override
  Widget build(BuildContext context) {
    return Container(
      margin: EdgeInsets.only(top: 8),
      child: ListView(
        
        children: [
          postbar(),
          Divider(thickness: 2,),
         storybar(),
         Divider(thickness: 2,),
      SingleChildScrollView(
        scrollDirection: Axis.vertical,
           child: post()
      ),
        ],
      ),
    );
  }
}

post.dart

 Widget build(BuildContext context) {
        return FutureBuilder<List<Posts>>(
            future: fetchPost(),
            builder: ((context, snapshot) {
              if (snapshot.hasData) {
                return ListView.builder(itemCount: snapshot.data!.length, shrinkWrap: true, itemBuilder: (context,i){
                // for (var i = 0; i < snapshot.data!.length; i  ) {
                  bool a=false;
                  return Container(
                      child: Column(
                    children: [ childrens]
                       )
                      )
                   })
                }
             })
            }
       


     The only postbar and storybar is scrolling but not post.

CodePudding user response:

If you want the main listView just scroll you can set post's listview physics to NeverScrollableScrollPhysics, like this:

Widget build(BuildContext context) {
    return FutureBuilder<List<Posts>>(
        future: fetchPost(),
        builder: ((context, snapshot) {
          if (snapshot.hasData) {
            return ListView.builder(
                physics: NeverScrollableScrollPhysics(), //<----- add this
                itemCount: 10,
                shrinkWrap: true,
                itemBuilder: (context, i) {
                  // for (var i = 0; i < snapshot.data!.length; i  ) {
                  bool a = false;
                  return Container(
                    child: Column(children: [childrens]),
                  );
                });
          }
        }));
  }

CodePudding user response:

There are a few things that could be causing this:

  1. Make sure that your ListView is inside of a SingleChildScrollView. This will allow the ListView to scroll.

  2. Make sure that you are using a ListView.builder() rather than a ListView() widget. This will allow the ListView to scroll.

  3. Make sure that you have set the shrinkWrap property to true. This will allow the ListView to scroll.

  4. Make sure that you are using a ListView.separated() widget rather than a ListView() widget. This will allow the ListView to scroll.

  5. Finally, make sure that you are using the proper constraints. If you are using a Column widget, make sure that the main axis is set to vertical. If you are using a Row widget, make sure that the main axis is set to horizontal.

CodePudding user response:

While the parent widget handling scroll event, you can use Column widget to return children instead of using ListView,

builder: ((context, snapshot) {
  if (snapshot.hasData) {
    return Column(children: [
      for (var i = 0; i < snapshot.data!.length; i  )
        Container(
          child: Column(
            children: [],
          ),
        )
    ]);
  }

It seems like you were trying to using looping with extra variable, you can create inline function like

if (snapshot.hasData) {
  return Column(
    children: [
      ...() {
        List<Widget> items = [];
        for (var i = 0; i < snapshot.data!.length; i  ) {
          items.add(Container(
            child: Column(
              children: [],
            ),
          ));
        }
        return items;
      }()
    ],
  );
}

Also mapping the list

if (snapshot.hasData) {
  return Column(
    children: snapshot.data!.map(
      (e) {
        return Container(
          child: Column(
            children: [],
          ),
        );
      },
    ).toList(),
  );
}
  • Related