javascript - 如何处理具有数十个 View 的 ScrollableView？

Question

我在 Titanium 中有一个 ScrollableView(仅针对 Android)，它必须滚动几十个 View 。每个 View 都是关于一段或两段文本，可能还有一两张图片。

我担心从一开始就填充所有 View 会对 CPU 造成太大压力。因此，我的计划是一次在 ScrollableView 中实际上只有 3 个 View 。

这是我想出的解决方案。 View 编号为 1 到 10。粗体编号的 View 是当前 Activity 的 View 。破折号是占位符。当用户查看第一个 View 时:

1 2 3 - - - - - - -

用户向右滚动。

1 2 3 - - - - - - -

用户再次向右滚动， View 1 被移除。 View 4 现在已按预期添加到 ScrollableView。

- 2 3 4 - - - - - -

等等。

我面临的障碍是，据我所知，无法在现有 View 之前插入 View (如向左滚动 的情况)。

我应该如何实现？

Answer 1

我创建了 a Titanium module , 基于 this GitHub gist ，就是这样做的。

用法是这样的:

var VirtualScroller = require('ui/common/VirtualScroller');

var virtualScroller = VirtualScroller({
    itemCount: 10,
    start: 0,
    getView: function(i) {
        return Titanium.UI.createLabel({
            width: Titanium.UI.FILL,
            height: Titanium.UI.FILL,
            text: "This is item " + (i + 1)
        });
    },
    isInfinite: false
});

window.add(virtualScroller.view);

该模块通过控制具有三个 View 的 ScrollableView 来工作(类似于原始要点)。它支持有限(以上示例)和无限滚动。

我已经发布了详细信息 on my blog , 它可用 at BitBucket .