Model view controller Sencha触摸屏-屏幕转换时的滞后

Model view controller Sencha触摸屏-屏幕转换时的滞后,model-view-controller,touch,cordova,sencha-touch,lag,Model View Controller,Touch,Cordova,Sencha Touch,Lag,好的,我正在测试用Phonegap包装的Sencha Touch框架,并用Android 2.2编译成HTC Desire。此应用程序的目的只是为了熟悉框架及其功能 我使用的是MVC模型。该应用程序由使用代理从json文件加载到数据存储中的项目列表组成。单击其中一个项目时,将显示详细信息页面 app.views.viewport.setActiveItem(app.views.placesList, options.animation); 但在过渡之前,会出现某种滞后,并且会在很短的时间内显示

好的,我正在测试用Phonegap包装的Sencha Touch框架,并用Android 2.2编译成HTC Desire。此应用程序的目的只是为了熟悉框架及其功能

我使用的是MVC模型。该应用程序由使用代理从json文件加载到数据存储中的项目列表组成。单击其中一个项目时,将显示详细信息页面

app.views.viewport.setActiveItem(app.views.placesList, options.animation);
但在过渡之前,会出现某种滞后,并且会在很短的时间内显示一个白色屏幕。我制作了一个视频,让它更清楚:

下面的代码显示了我的应用程序的结构和功能:

型号

app.models.Place = Ext.regModel("app.models.Place", {
    fields: [
        {name: "name", type: "string"},
        {name: "location", type: "string"}
    ]
});
app.stores.places = new Ext.data.Store({
    model: "app.models.Place",
    proxy: {
        type: 'ajax',
        url : 'js/app/data/products.json',
        reader: {
            type: 'json',
            root: 'products'
        }
    }
});
查看

app.views.PlacesList = Ext.extend(Ext.Panel, {
    fullscreen: true,
    scroll: 'vertical',
    dockedItems: [{
        xtype: 'toolbar',
        title: 'PlacesList'
    }],
    items: [{
        xtype: 'list',
        store: app.stores.places,
        itemTpl: '{name}',     
        onItemDisclosure: function () {
            Ext.dispatch({
                controller: app.controllers.places,
                action: 'show'
            });
        }
    }],
    initComponent: function() {
        app.stores.places.load();
        app.views.PlacesList.superclass.initComponent.apply(this, arguments);
    }
});
控制器

app.controllers.places = new Ext.Controller({
    show: function(options) {
        app.views.viewport.setActiveItem(app.views.placeDetail, options.animation);
    },
    back: function(options) {
        app.views.viewport.setActiveItem(app.views.placesList, options.animation);
    }
});
我想知道经验的滞后是来自Sencha Touch,还是来自代码

提前感谢,


杰拉德(Gerard)

相信斯蒂芬·希勒(Steffen Hiller)的回答:,这是Sencha Touch中的幻灯片动画所做的。积分进入有趣的设备性能提示页面。“

澄清之前的答案:

如果您仅在卡片布局中的面板上使用幻灯片动画(例如通过Ext.TabPanel),只需添加以下CSS/SCSS代码即可

.x-panel {
    -webkit-backface-visibility: hidden;
}
我正在使用Sencha Touch 1.0.1a和PhoneGap 0.9.4


这要归功于Steffen Hiller在这里发布的hist帖子:

Fixed.From:“显然,这个错误出现在所有设置CSS中不透明度的过渡中,Sencha Touch中的幻灯片动画就是这样做的。信用卡转到有趣的设备性能提示页面。“在该网站上找到修复程序。使用此CSS代码使Sencha Touch表单在带有HTC Sense的android设备下无法使用(很多)。