Nativescript ListView scrollToIndex 与android上的动画

Question

我正在开发一个聊天应用程序，当列表加载时，当一个新项目添加到列表时，我需要滚动到列表底部。我可以用这个来做。

scrollToBottom() {
  let lv =  <ListView>frame.topmost().getViewById('messageList');
  lv.scrollToIndex(this.store.items.getValue().length - 1)
}

但它立即显示列表底部

有一个指南可以在 IOS 上执行此操作，但在 Android 上没有

private srollListView(position: number) {
     if (this._listView.ios) {
        this._listView.ios.scrollToRowAtIndexPathAtScrollPositionAnimated(
            NSIndexPath.indexPathForItemInSection(position, 0),
            UITableViewScrollPosition.UITableViewScrollPositionTop,
            true
        );
     }
     else {
         this._listView.scrollToIndex(position);
     }
}

指南链接: http://nuvious.com/Blog/2016/4/4/how-to-make-the-nativescript-listview-scrolltoindex-animated-on-ios

有没有办法在Android上做到这一点？

Answer 1

您可以使用 smoothScrollToPosition android 方法，它为您需要的 ListView 提供平滑滚动。我正在提供示例代码。

主页.xml

<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo">
    <GridLayout>
        <ListView items="{{ source }}"  id="lvid" loaded="onLoaded" itemLoading="onItemLoading" itemTap="onItemTap">
            <ListView.itemTemplate>
                <StackLayout>
                    <Label text="{{title}}" textWrap="true" />
                </StackLayout>
            </ListView.itemTemplate>
        </ListView>
    </GridLayout>
</Page>

主页.ts

import { EventData } from 'data/observable';
import { Page } from 'ui/page';
import { HelloWorldModel } from './main-view-model';
import {ListView} from "ui/list-view"

// Event handler for Page "navigatingTo" event attached in main-page.xml
export function navigatingTo(args: EventData) {

    let page = <Page>args.object;
    var array=[];
    for(var i=0;i<100;i++){
        array.push({title:"title"+i});
    }
    page.bindingContext = {source:array};

    setTimeout(function(){
        var listview:ListView =<ListView> page.getViewById("lvid");
        listview.android.smoothScrollToPosition(60);
    }, 4000)
}