我有一个带有RadListView组件的nativescript-vue应用程序,用于向用户显示数据。列表的每一行都包含当前项目的多个信息。当我点击一个按钮以加载并显示列表时,UI冻结(快速硬件->短;慢速硬件->长)。我发现加载/合并数据的代码部分运行时间很短,但是UI元素的nativescript内部渲染或创建是问题所在。android控制台显示信息
I/Choreographer: Skipped 430 frames! The application may be doing too much work on its main thread.
Run Code Online (Sandbox Code Playgroud)
我看了stackoverflow和github,但是那里的问题(例如NativeScript Angular RadListView渲染速度非常慢)看起来相似,但是解决方案不适合我。
我使用LinearListView(而不是Grid或Stagged),也许在我的真实应用程序中,我将能够简化列表中的行元素,但在我的示例应用程序中(向下看),我将使用简单的行ui设计。
为了获得更简单,更好的报告,我在{N} -Playground上创建了一个示例应用程序。该应用程序将创建10000个数组元素并将其设置为RadListView的源,其中每个元素都有一个Label,一个Switch和一个ActivityIndicator。
I/Choreographer: Skipped 430 frames! The application may be doing too much work on its main thread.
Run Code Online (Sandbox Code Playgroud)
第一步,将在一个临时数组中生成10000个元素:
loadData() {
this.tmpAlarms = [];
for (let i = 0; i <= 10000; i++) {
this.tmpAlarms.push({
name: "Hase " + i,
active: i % 2 === 0, …Run Code Online (Sandbox Code Playgroud) radlistview nativescript nativescript-telerik-ui nativescript-vue
Nativescript radListView 不显示来自 ios 和 android 操作系统的组件的绑定项。
操作栏和通常的 ListView 显示数据,但 radlistview 不显示。控制台没有显示错误。但我看到下一个存储库中的 RadListView 可以工作 -> https://github.com/telerik/nativescript-ui-samples-angular
我的开发环境如下。
os: macOS sierra 10.12.6
node : v6.12.0
npm : 3.10.10
nativescript 之后可以看到其他的,在 package.json
我似乎这个问题是关于这些......
但我无法提炼。
我在 'tns create ui-test --ng' 之后在 angular 上实现了 RadListView,如下所示。
成分
export class ItemsComponent implements OnInit {
private _dataItems: ObservableArray<Item>;
constructor() {
}
get dataItems(): ObservableArray<Item> {
return this._dataItems;
}
ngOnInit() {
this._dataItems = new ObservableArray([
{ id: 1, name: "Ter Stegen", role: …Run Code Online (Sandbox Code Playgroud)