Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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?

like image 315
abarraford Avatar asked Mar 23 '18 00:03

abarraford


People also ask

How do I make my ListView builder not scrollable?

You can make the ListView widget never scrollable by setting physics property to NeverScrollableScrollPhysics().

How do I get rid of the Scrollbar in flutter?

The easiest and quickest way to achieve this is to set thickness: 0 on the Scrollbar widget. It'll look something like this: Scrollbar( thickness: 0, child: ... )


1 Answers

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."

like image 181
abarraford Avatar answered Nov 15 '22 11:11

abarraford