CODEWITHSUNDEEP
androidlistviewscrollnativescriptangular5
user1513171
user1513171

Reputation: 1974

Nativescript can't get ListView to scroll to bottom

On load, I'm trying to get a ListView to scroll to the bottom. However, nothing happens. Here's what I have, running on Android:

   <ListView #lv row="0" [items]="myItems" class="list-group" separatorColor="transparent" [itemTemplateSelector]="templateSelector">

Then in Typescript I have:

  @ViewChild('lv') listViewElem: ElementRef;

    private scrollToBottom(lv: ListView) {
    if (lv && lv.items.length > 0) {
        lv.scrollToIndex(lv.items.length - 1);
        lv.refresh();
    }
}

  ngAfterViewInit() {
    setTimeout(() => {
       this.scrollToBottom(this.listViewElem.nativeElement);
    }, 500);
}

As I debug, everything seems good. In ngAfterViewInit, listViewElem is defined, in scrollToBottomView items is set to an array with 6 elements in it. But when it's called nothing is happening.

I've also tried to just add a button to the view that when you click I call this same logic to see if it's just a load-time initialization order thing, but that doesn't work either:

  <Label row="0" text="Click Me" filter(tap)="scrollNow()"></Label>

And: 

 public scrollNow(): void {
     this.scrollToBottom(this.listViewElem.nativeElement);
  }

Any ideas?

Upvotes: 1

Views: 2189

Answers (2)

Codedreamer
Codedreamer

Reputation: 1702

function sendComment(arg) {
    var message = Frame.topmost().currentPage.getViewById('message').text;
    var listView = Frame.topmost().currentPage.getViewById('listview');
    chatMessages.push({
        sender_id: '828838383333',
        receiver_id: '939939494949',
        body: message,
        from: {},
        to: {},
        createdAt: ''
    });
    listView.refresh();
    listView.scrollToIndex(chatMessages.length - 1, false);
}

The chatMessages is your observable array.

Upvotes: 0

Manoj
Manoj

Reputation: 21898

May I know why do you try lv.refresh(); right after scrollToIndex, because refresh will reload the ListView and it will just go back to start.

Upvotes: 4

Related Questions