flutterflutter-listviewsinglechildscrollview

What is the difference between ListView and SingleChildScrollView+ListBody in Flutter?


I have a question about comparing ListView and SingleChildScrollView containing a ListBody. Seemingly, those two results look the same. But I'm curious about whether those two have a difference in function. In my opinion, it could be the part of efficiency or performance, but I'm not sure. Thanks in advance.

SingleChildScrollView + ListBody

final items = List.generate(100, (index) => index).toList();

SingleChildScrollView(
  child: ListBody(
    children: items.map((e) => Text('$e')).toList(),
  )
)

ListView

final items = List.generate(100, (index) => index).toList();

ListView(
  children: items.map((e) => Text('$e')).toList(),
)

Solution

  • I known one diff:

    Today , I fix a bug, Related to ListView lazy loading features ,I Change to ListBody , fix it .

    I have a app, use flutter-markdown , i use ListView to render many markdown fragment,like this:

    ListView(
       children: <Markdown>[..._contents], 
    )
    

    I use flutter_markdown.MarkdownElementBuilder to parse Markdown outline(TOC Table of Content), but flutter_markdown ast logic only run on Markdown.build(), so , If you don't pull down the ListView page to the bottom, you won't get the full outline ,bug show: bug image

    I fixed this bug with ListBody

    SingleChildScrollView(
      child: ListBody(
           children: <Markdown>[..._contents], 
        )
    )
    

    after fix bug: bug fix image

    Additionally, if you are browsing a long page, there may be some stuck (Use ListView) when scrolling down , Because ListView loads calculations from time to time during pull-down.