Сенча сенсорные прямоугольные спрайты не отображаются на экране

Question

Я реализую приложение с сенсорным Сенча. cmd 6, touch 2.4, архитектор 3.0.0.1

Я использую компонент ящика, и я хочу нарисовать спрайт прямоугольника. Firefox может показать мой прямоугольник, а Chrome - нет, а также, когда я переношу свое приложение в apk... это мой код:

Ext.define('MyApp.view.MyComponent', {
extend: 'Ext.draw.Component',

config: {
    border: 9,
    bottom: '',
    centered: false,
    cls: 'sa',
    draggable: true,
    fullscreen: true,
    id: 'd21',
    itemId: 's21',
    zIndex: 4,
    modal: false,
    sprites: [
        {
            zIndex: 30,
            type: 'rect',
            width: 100,
            height: 30,
            fill: 'red',
            stroke: 'black',
            fx: {
                duration: 0.00001,
                to: {
                    fill: '#00ff00'// Green
                }
            },
            translate: {
                x: 130,
                y: 115
            }
        },
        {
            type: 'text',
            fontSize: 18,
            fill: '#000',
            text: 0,
            textAlign: 'center',
            x: 90,
            y: 140
        }
    ]
}

});

в чем проблема?

Answer 1

Пожалуйста, поместите этот код в функцию запуска. Потому что в более новой версии Chrome что-то сломалось в Sencha Touch. так что вы можете поместить этот код в файл app.js в функции запуска.

Может быть, это решит вашу проблему. Вы можете проверить пример скрипки в Chrome. https://fiddle.sencha.com/

Ext.override(Ext.util.SizeMonitor, {    
constructor: function(config) {
    var namespace = Ext.util.sizemonitor;
    if (Ext.browser.is.Firefox) {
        return new namespace.OverflowChange(config);
    } else if (Ext.browser.is.WebKit) {
        if (!Ext.browser.is.Silk && Ext.browser.engineVersion.gtEq('535') && !Ext.browser.engineVersion.ltEq('537.36')) {
            return new namespace.OverflowChange(config);
        } else {
            return new namespace.Scroll(config);
        }
    } else if (Ext.browser.is.IE11) {
        return new namespace.Scroll(config);
    } else {
        return new namespace.Scroll(config);
    }
}
});
Ext.override(Ext.util.PaintMonitor, {
constructor: function(config) {
    if (Ext.browser.is.Firefox || (Ext.browser.is.WebKit && Ext.browser.engineVersion.gtEq('536') && !Ext.browser.engineVersion.ltEq('537.36') && !Ext.os.is.Blackberry)) {
        return new Ext.util.paintmonitor.OverflowChange(config);
    } else {
        return new Ext.util.paintmonitor.CssAnimation(config);
    }
}
});