Question

我对此进行了一些研究，但仍然找不到合适的解决方案。我在ExtJS 4.1中编写了我的应用程序，当我在iPod上运行该应用程序时，默认情况下禁用了拖动功能（这是我想要的），但是如果我在ExtJS 6.2中编写相同的应用程序，则所有窗口都可以拖动，从而导致可见性问题该应用程序。话虽如此，有谁知道使用平板电脑（iPod，iPad等）时如何禁用窗口拖动？我正在使用ExtJS 6.2

这是我的工作代码，非常适合单个窗口，但是我想要一个通用的解决方案，该方法将阻止拖动所有窗口。

       var win = Ext.create('Ext.Window', {
            title: "My Window",
            width: 500,
            modal: true,
            layout: 'fit',
            items: form,
            buttons: [{
                text: 'Close',
                handler: function() {
                    win.hide();
                }
            }]
        });

        win.show();

        if(Ext.os.deviceType === 'Tablet') {
            win.dd.disable();
        }

Answer 1

您正在寻找Ext.os class。更准确地说，Ext.os.is方法根据the docs具有您所需的所有值。

我不确定为什么您只想阻止iPad，而一般不阻止桌子。如果您要使用平板电脑，则可以使用if(Ext.os.deviceType === 'Tablet') {...}

否则为if(Ext.os.is.iPad) {...}。

更新解决方案：

如果要在ExtJS的所有类中强制执行任何操作，则可以使用Ext.override。

因此解决方案是将以下代码放在应用程序的开头：

if (Ext.os.deviceType === 'Tablet') {
    Ext.override('Ext.Window', {
        privates: {
            initDraggable: function(){}
        }
    })
}

仅供参考，您可以检查Ext.Window源代码。我必须重写此方法，默认值draggable: false不起作用。 https://fiddle.sencha.com/#view/editor&fiddle/2iqi
要进行测试，只需按F12切换到表格模式即可。

但是此解决方案有1个缺点：

如果目标是使用Ext.define声明的类，则重写该类的方法称为

这意味着当您使用Ext.create('Ext.Window',{})

时此解决方案不起作用

解决方案是定义自己的Ext.Window类，而不是在应用程序内部使用Ext.create('Ext.Window'时使用Ext.create('Fiddle.view.MyWindow',，而当我们已经拥有自己的功能时，不需要使用重写，但可以直接将其放入类定义中，例如：

Ext.define('Fiddle.view.MyWindow', {
    extend: 'Ext.Window',
    alias: 'widget.mywindow',

    draggable: (function(){
        if (Ext.os.deviceType === 'Tablet') {
            return false;
        } else {
            return true;
        }
    })()

});

https://fiddle.sencha.com/#view/editor&fiddle/2iqj

如果您仍然坚持使用Ext.create('Ext.Window'，我不知道如何覆盖它。一种解决方案是重新编写Ext.create或简单地编辑框架源本身，但我对此表示强烈反对。

Answer 2

“全局解决方案”听起来像您想使用替代将其他答案之一全局应用于您的应用程序：

Ext.define('MyAppName.override.Window', {
    override: 'Ext.window.Window',
    initComponent: function() {
        this.callParent(arguments);
        if(Ext.os.deviceType === 'Tablet') {
            this.dd.disable();
        }
    }
})

或

Ext.define('MyAppName.override.Window', {
    override: 'Ext.window.Window',
    initComponent: function() {
        if(Ext.os.deviceType === 'Tablet') {
            this.draggable = false;
        }
        this.callParent(arguments);
    }
})

要使覆盖生效，请将其放入文件app/override/Window.js中，并在requires中添加对您的Application.js数组的引用：

requires: [
    'MyAppName.override.Window'
],

Answer 3

为什么在窗口配置中不使用var win = Ext.create('Fiddle.view.MyWindow', { title: "My Window", width: 500, draggable: false, modal: true, layout: 'fit', buttons: [{ text: 'Close', handler: function() { win.hide(); } }] }); win.show(); 这是FIDDLE

中的一些代码

browser.wait(function(){
  return element(by.css("input[type='checkbox']"))
                  .getAttribute("ng-reflect-model")
                  .then(function(ngReflectModel){
                     return ngReflectModel == "false";
                  })
},5000);

拖曳视窗

3 个答案: