Sencha Touch - отставание при переходе экрана - PullRequest
0 голосов
/ 04 апреля 2011

Хорошо, я тестирую инфраструктуру Sencha Touch, завернутую в Phonegap и скомпилированную для HTC Desire с Android 2.2. Цель этого приложения - просто познакомиться с платформой и ее (не) возможностями.

Я использую модель MVC. Приложение состоит из списка элементов, которые загружаются в хранилище данных из файла json с использованием прокси. При щелчке по одному из этих элементов отображается страница сведений.

app.views.viewport.setActiveItem(app.views.placesList, options.animation);

Но перед переходом наблюдается некоторая задержка, и белый экран показывается в течение очень небольшого промежутка времени. Я сделал видео, чтобы сделать его более понятным:

http://www.youtube.com/watch?v=uW8hspMKqfc

Код ниже показывает структуру и функциональность моего приложения:

Модель

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'
        }
    }
});

View

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

Ответы [ 2 ]

0 голосов
/ 07 августа 2011

Чтобы уточнить предыдущие ответы:

Если вы используете анимацию слайдов только для своих панелей в макете карты (например, с помощью Ext.TabPanel), просто добавьте следующий код CSS / SCSS, и все будет хорошо.

.x-panel {
    -webkit-backface-visibility: hidden;
}

Я использую Sencha Touch 1.0.1a и PhoneGap 0.9.4.

Благодарность за это отправляется Штеффену Хиллеру для исторического поста здесь: http://www.senchatouchbits.com/6/fixing-flickering-of-animations-in-phonegap.html

0 голосов
/ 06 апреля 2011

Отвечайте Штеффену Хиллеру за этот ответ: Эта ошибка появляется для всех переходов, которые устанавливают непрозрачность в CSS , что делает анимация слайдов в Sencha Touch.Кредиты переходят на интересные советы по производительности для страницы устройства. "

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...