1

我有一个在 Sencha 2.2.1 中使用拖放的复杂应用程序 - 在 Webkit 浏览器上运行出色，但现在 Sencha Touch 支持 IE 10，我想尝试一下。

我无法让阻力工作，所以我从头开始了一个非常简单的测试。

我使用 sencha cmd generate 构建了一个新的“hello world”应用程序，并使用了您在下面看到的 Main.js。我可以在 webkit 浏览器中拖动内部面板没问题，但内部面板甚至没有出现在 IE 10 中。尝试了几天，但无法弄清楚这个新的 Ext.util.Translatable 交易是如何工作的以及它是如何工作的应该在 IE 10 中工作。

（环境：Win 7 64 位；Sencha 2.2.1 商业 SDK；Sencha Cmd v3.1.2.342；像这样的“sencha app build package”构建包，并从没有网络服务器的文件夹中运行 index.html）

视图\Main.js：

Ext.define('mytest.view.Main', {
extend: 'Ext.tab.Panel',
xtype: 'main',
requires: [
    'Ext.TitleBar',
    'Ext.Video',
    'Ext.util.Draggable'
],
config: {
    tabBarPosition: 'bottom',
    items: [
        {
            title: 'Welcome',
            iconCls: 'home',
            styleHtmlContent: true,
            scrollable: true,
            items: [{
                docked: 'top',
                xtype: 'titlebar',
                title: 'Welcome to Sencha Touch 2'
            },{
                xtype: 'panel',
                layout: 'hbox',
                html: 'mybutton',
                width: 300,
                height: 80,
                left: 5,
                top: 5,
                id: 'mydraggable',
                draggable: 'both',
                constraint: {
                    min: { x: 0, y: 0 },
                    max: { x: 1000000, y: 1000000 }
                  },
                listeners: {
                    drag: {
                        element: 'element',
                        fn:  function(draggable, e){
                            console.log("left: ", this.getLeft(), "top: ",this.getTop(), "X: ",this.element.getX(), "Y: ",this.element.getY());
                            //this.setLeft(this.element.getX());
                            //this.setTop(this.element.getY());
                        }
                    },
                    tap: {
                        element: 'element',
                        fn: function(view, index, target, record, event){
                            alert("Tapped");
                        }
                    }
                }
            }]
        },
        {
            title: 'Get Started',
            iconCls: 'action',

            items: [
                {
                    docked: 'top',
                    xtype: 'titlebar',
                    title: 'Getting Started'
                },
                {
                    xtype: 'video',
                    url: 'http://av.vimeo.com/64284/137/87347327.mp4?token=1330978144_f9b698fea38cd408d52a2393240c896c',
                    posterUrl: 'http://b.vimeocdn.com/ts/261/062/261062119_640.jpg'
                }
            ]
        }
    ]
},
initialize: function (){

    this.callParent();
}
});
4

1 回答 1

1

我在使用 Sencha Touch 框架开发应用程序时遇到了同样的问题。拖动功能在 -webkit 浏览器中运行良好，但在 IE10 中失败。

我想出的是，对于拖动功能，sencha 内部机制正在使用 -webkit-transform CSS 属性来翻译文档中的组件。

由于 IE 不支持这些属性，拖动失败。

我的建议是尝试覆盖默认功能并为任何浏览器实现 polyfill。

很抱歉没有为这个问题提供修复（目前正在开发中）。当我让它工作时，我会在这里添加它。

于 2014-01-14T12:12:23.183 回答