标签: radlistview

NativeScript-Vue在Android下渲染RadListView非常慢并冻结UI

我有一个带有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)

平台信息:

  • tns-ios 5.2.0
  • tns-android 5.2.1
  • nativescript-ui-listview 6.2.0
  • tns-core-modules 5.3.1

类似问题报告

我看了stackoverflow和github,但是那里的问题(例如NativeScript Angular RadListView渲染速度非常慢)看起来相似,但是解决方案不适合我。

我使用LinearListView(而不是Grid或Stagged),也许在我的真实应用程序中,我将能够简化列表中的行元素,但在我的示例应用程序中(向下看),我将使用简单的行ui设计。

示例应用

为了获得更简单,更好的报告,我在{N} -Playground上创建了一个示例应用程序。该应用程序将创建10000个数组元素并将其设置为RadListView的源,其中每个元素都有一个Label,一个Switch和一个ActivityIndi​​cator。

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

9
推荐指数
1
解决办法
460
查看次数

Nativescript radListView 不显示项目

概述

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

考虑

我似乎这个问题是关于这些......
但我无法提炼。

  1. 角度指令
  2. 初始化一个可观察的数组

代码

我在 '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)

radlistview nativescript angular

1
推荐指数
1
解决办法
2015
查看次数