2

我一直试图弄清楚为什么我的应用程序中的可滚动视图非常生涩，当我在页面之间滑动时它会暂时停止。每个页面的内容并不复杂，只有几个文本字段和一个图像。页数最多8页。我使用的版本是；钛 3.1.2GA 合金 1.2.1 iOS 6.1.3 在 iPhone4 <<< 重要 - 在 iPhone5 上不那么明显 请注意，我在去年 11 月开始了这个项目，并且在新的时候升级了我的环境版本已可用。可以使用一些旧代码吗？我看到了针对此问题提出的早期 pre-1.0 Alloy 错误，它是否仍然存在于我的环境中？我使用标准的两个选项卡 Alloy 模板创建了一个测试应用程序，并添加了下面的代码。对于第二个选项卡，我刚刚将选项卡 1 中使用的图像保存到磁盘。Tab 3 没有任何图像，但仍然有点生涩。在我的应用程序中，我在每个页面上都有更多视图，而且非常生涩。如果有人有任何建议，我将不胜感激。如果有人请确认 iPhone4 的问题，那就太好了，只是为了确保我的环境不是原因（我想我可以尝试卸载并重新安装，但我不确定如何正确卸载所有内容）。干杯，拉斯

索引.xml

<Alloy>
    <TabGroup>
        <Tab title="Tab 1" icon="KS_nav_ui.png">
            <Window id="window1" title="Tab 1">
            </Window>
        </Tab>
        <Tab title="Tab 2" icon="KS_nav_views.png">
            <Window id="window2" title="Tab 2">
            </Window>
        </Tab>
        <Tab title="Tab 3" icon="KS_nav_ui.png">
            <Window id="window3" title="Tab 3">
            </Window>
        </Tab>
    </TabGroup>

索引.js

function createViews() {
    var v10 = createPage('http://upload.wikimedia.org/wikipedia/commons/thumb/e/ec/Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg/402px-Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg', "#00FFFF");
    var v11 = createPage('http://upload.wikimedia.org/wikipedia/commons/thumb/e/ec/Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg/402px-Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg', "#FF00FF");
    var v12 = createPage('http://upload.wikimedia.org/wikipedia/commons/thumb/e/ec/Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg/402px-Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg', "#FFFF00");
    var v13 = createPage('http://upload.wikimedia.org/wikipedia/commons/thumb/e/ec/Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg/402px-Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg', "#FFFFFF");
    var v14 = createPage('http://upload.wikimedia.org/wikipedia/commons/thumb/e/ec/Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg/402px-Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg', "#FFFFFF");
    var v15 = createPage('http://upload.wikimedia.org/wikipedia/commons/thumb/e/ec/Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg/402px-Mona_Lisa%2C_by_Leonardo_da_Vinci%2C_from_C2RMF_retouched.jpg', "#FFFFFF");

    var v20 = createPage("images/Mona_Lisa.jpg", "#00FFFF");
    var v21 = createPage("images/Mona_Lisa.jpg", "#FF00FF");
    var v22 = createPage("images/Mona_Lisa.jpg", "#FFFF00");
    var v23 = createPage("images/Mona_Lisa.jpg", "#FFFFFF");
    var v24 = createPage("images/Mona_Lisa.jpg", "#FFFFFF");
    var v25 = createPage("images/Mona_Lisa.jpg", "#FFFFFF");

    var v30 = createPage(null, "#229900");
    var v31 = createPage(null, "#333333");
    var v32 = createPage(null, "#009900");
    var v33 = createPage(null, "#FF77FF");
    var v34 = createPage(null, "#007744");
    var v35 = createPage(null, "#009988");
    var v36 = createPage(null, "#DDBB00");
    var v37 = createPage(null, "#CCCCCC");
    var v38 = createPage(null, "#99FFFF");

    var photosView1 = Ti.UI.createScrollableView({
        views:[
            v10,v11,v12,v13,v14,v15 // http images
        ],
        showPagingControl:true,
        cacheSize: 21
    });

    $.window1.add(photosView1);

    var photosView2 = Ti.UI.createScrollableView({
        views:[
            v20,v21,v22,v23,v24,v25 // file images
        ],
        showPagingControl:true,
        cacheSize: 21
    });
    $.window2.add(photosView2);

    var photosView3 = Ti.UI.createScrollableView({
        views:[
            v30,v31,v32,v33,v34,v35  // colored pages
        ],
        showPagingControl:true,
        cacheSize: 21
    });
    $.window3.add(photosView3);
}

function createPage(image, bkgColor) {
    var detailsView = Ti.UI.createView({
        width: Ti.UI.FILL,
        height: Ti.UI.FILL,
        top: 5,
        left: 5,
        right: 5,
        bottom: 100,
        backgroundColor: bkgColor
    });

    if (image) {
        var imageView = Ti.UI.createImageView({
            image:image
        });
        detailsView.add(imageView);
    }

    var labelView0 = Ti.UI.createLabel({
        text: "Label 0"
    });
    detailsView.add(labelView0);

    var pageView = Ti.UI.createView({
        width: Ti.UI.FILL,
        height: Ti.UI.FILL,
        backgroundColor: "#E4E8E8"  
    });
    pageView.add(detailsView);

    var labelContainer = Ti.UI.createView({
        height: 90,
        bottom: 5,
        left: 5,
        right: 5,
        backgroundColor: "#FFAAFF"
    });
    pageView.add(labelContainer);

    var labelView1 = Ti.UI.createLabel({
        bottom: 50,
        text: "Label 1"
    });
    labelContainer.add(labelView1);

    var labelView2 = Ti.UI.createLabel({
        bottom: 10,
        text: "Label 2"
    });
    labelContainer.add(labelView2);

    return pageView;
}

createViews();
$.index.open();

2013 年 9 月 6 日 ...

基于一个评论，即布局的歧义可能导致我现在尝试使用具有绝对位置和大小的视图时出现抖动。我还只使用了文件系统中的图像，这些图像具有与图像视图完全相同的大小。请看下面的代码。更好，但抖动仍然存在，这意味着底层问题无法通过绝对位置和大小来解决。

function createPage(image, bkgColor) {
    var detailsView = Ti.UI.createView({
        width: 300,
        height: 300,
        top: 0,
        backgroundColor: bkgColor
    });

    if (image) {
        var imageView = Ti.UI.createImageView({
            width: 300,
            height: 300,
            image:image
        });
        detailsView.add(imageView);
    }
    else {
        var labelView0 = Ti.UI.createLabel({
            width: 300,
            height: 300,
            text: "No Image"
        });
        detailsView.add(labelView0);
    }

    var pageView = Ti.UI.createView({
        width: 300,
        height: 400,
        backgroundColor: "#E4E8E8"  
    });
    pageView.add(detailsView);

    var labelContainer = Ti.UI.createView({
        width: 300,
        height: 100,
        top: 300,
        backgroundColor: "#FFAAFF"
    });
    pageView.add(labelContainer);

    var labelView1 = Ti.UI.createLabel({
        width: 300,
        height: 20,
        top: 10,
        left: 10,
        text: "Label 1"
    });
    labelContainer.add(labelView1);

    var labelView2 = Ti.UI.createLabel({
        width: 300,
        height: 20,
        top: 40,
        left: 10,
        text: "Label 2"
    });
    labelContainer.add(labelView2);

    return pageView;
}
4

1 回答 1

1

对我来说，这与scrollableView.cacheSize财产有关。尝试将其设置为您的视图数组的长度。

于 2013-09-05T14:31:14.007 回答