Search code examples
listviewflutterbuilder

Flutter ListView.builder creates an infinite scroll. How can I set it to stop at the end of content?


I am using ListView.buildler to layer Widget, into a vertical scroll. My only issue with this approach is that when the scroll reaches the end of my content. It wraps back to the top automatically. Currently I have this:

    new ListView.builder(
    scrollDirection: Axis.vertical,
    key: new Key(randomString(20)),
    reverse: false,
    primary: true,
    itemBuilder: (BuildContext context, int index) {
        return new Column(
        children: <Widget>[
            new Padding(
            padding: _bookPadding,
            child: new Container(
                width: 106.0,
                height: 162.0,
                child: new FadeInImage(
                    placeholder: new AssetImage('assets/loading.gif'),
                    image: this.book.cover)
            ),
            ),
            const Divider(),
            new Padding(
                padding: _bookPadding,
                child: new Text(
                    this.book.bookName,
                    style: getTextStyle())),
            const Divider(),
            new Padding(
            padding: _bookPadding,
            child: new Text(
                'By ' + this.book.author,
                style: getTextStyle(), ),
            ),
           ....

Is it possible to set ListView.builder to no-wrap when it reaches the end?


Solution

  • This ended up being pretty easy. Not sure how I missed it from the docs, all I needed to add was an Item count = non-null. In my case, since I am building all of my content in a single Column widget, inside the list-view builder, this is what my builder looks like:

    new ListView.builder(
        scrollDirection: Axis.vertical,
        key: new Key(randomString(20)),
        primary: true,
        itemCount: 1,
        itemBuilder: (BuildContext context, int index) {
            return new Column(
            children: <Widget>[ .....
    

    I do wonder about this implementation if its a bad pattern. Will ListView.Builder still render each nested children of Component Column, as each children of Column becomes visible?

    From the docs: "Creates a scrollable, linear array of widgets that are created on demand. This constructor is appropriate for list views with a large (or infinite) number of children because the builder is called only for those children that are actually visible."