在我的 Nativescript Angular 应用程序中,我在 ScrollView 中有一个 TextView,定义如下:
<ScrollView orientation="vertical" height="70%" width="100%" style="margin-bottom: 1%; background-color:white" (loaded)="onScrollerLoaded($event)">
<TextView
id="terminal" [text]="terminalText" editable="false"
style="color: whitesmoke; background-color: black; font-size: 8%; font-family: monospace" height="100%"
(tap)="onTap($event)" (loaded)="onTerminalLoaded($event)">
</TextView>
</ScrollView>
该元素的目的是充当终端,并快速打印来自蓝牙设备的传入消息。
目前,每当我向滚动视图添加一些文本时,滚动视图就会滚动回顶部terminalText
TextView 绑定到的变量。我希望能够将 ScrollView 保留在 TextView 的底部。
一些注意事项:
我正在将文本添加到terminalText
通过此方法在我的关联组件类中变量:
public appendToTerminal(appendStr){
this.terminalText += appendStr;
}
我尝试实现以下代码,该代码将在 ScrollView 加载后执行:
private scrollIntervalId;
onScrollerLoaded(data: EventData){
if(!this.scrollIntervalId){
this.scrollIntervalId = setInterval(()=>{
this.ngZone.run(() =>
(data.object as any).scrollToVerticalOffset((data.object as any).scrollableHeight, false)
)
}, 10);
}
}
(此尝试基于给出的解释here
我只在 Android 设备上尝试过此操作,因为我无法访问 Apple 设备。