sencha touch rect sprites 不会出现在屏幕上答案

【问题标题】：sencha touch rect sprites do not appears on screensencha touch rect sprites 不会出现在屏幕上
【发布时间】：2015-07-23 06:18:48
【问题描述】：

我正在使用 sencha touch 实现一个应用程序。 cmd 6，触摸 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
        }
    ]
}

});

有什么问题？

【问题讨论】：

标签： google-chrome firefox extjs touch drawer

【解决方案1】：

请将此代码放入启动函数中。因为较新版本的 chrome 在 sencha touch 中有些东西被破坏了。所以你可以把这段代码放在启动函数的app.js文件中。

也许它可以解决您的问题。您可以在 chrome 中查看小提琴示例。 https://fiddle.sencha.com/#fiddle/rbp

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

【讨论】：