CODEWITHSUNDEEP
flutter
Notbad
Notbad

Reputation: 6296

Set the item count ListView.builder creates upfront and when scrolling

I am building an infinite scroll list that shows images from an API. I have seen several ways of doing this but I am surprised that there's no easy method to accomplish this just with ListView.builder. I now use this base code, which makes listview.builder create infinite number of images inside the list (It even blocks the mainthread because doesn't stop retrieving new images):

Widget build(BuildContext context) {
    return Scaffold(
      appBar: new AppBar(
          automaticallyImplyLeading: true,
          leading: IconButton(
              icon: Icon(Icons.arrow_back),
              onPressed: () => Navigator.pop(context))),
      body: Container(
        child: ListView.builder(
            itemCount: _imgs.length,
            itemBuilder: (BuildContext context, int index) {
          //return Text(index.toString() + " -------------");
          return FadeInImage(
              image: NetworkImage("https://picsum.photos/200/300?random="+index.toString()),
              placeholder: AssetImage("data/jar-loading.gif"));
        }),
      ),
    );
  }

Isn't there any way to set the number of items the ListView.buider creates upfront and how many it should create when moving to a non "visited" scroll zone?

Upvotes: 0

Views: 625

Answers (1)

user10539074
user10539074

Reputation:

I think you're having spam of continuously creating list items because right after each list item created is zero sized

if you wrap FadeInImage with some widget that has height it will works as intended for example wrap with Container with height = 100

  child: ListView.builder(
    itemBuilder: (context, index) {
      return Container(
        height: 100,
        child: FadeInImage(
            image: NetworkImage("https://picsum.photos/200/300?random=" + index.toString()),
            placeholder: AssetImage("data/jar-loading.gif")),
      );
    },
  ),

also you should remove itemCount: _imgs.length,

Upvotes: 1

Related Questions