Question

我有一个带有vbox布局的容器，这个容器有一个工具栏和5个formPanels（每个都有一个字段集）作为子项，我的问题是这5个formPanel中的每一个似乎都是可拖动的，这是我不想要的东西。我已经尝试了几种方法来禁用拖动这些元素的能力，但到目前为止它们都没有工作......我怎样才能达到这样的效果？

到目前为止，我已经尝试过一些禁用拖动的东西（除了通过我的控制器执行类似的操作）：

draggable: false,
disableSelection: true,
locked: true

MyConfigView.js：

Ext.define('MyApp.view.MyConfigView', {
    extend: 'Ext.Panel',
    alias: 'widget.myConfigview',
    config: {
        layout: {
            type: 'vbox',
            align: 'stretch',
            fullscreen: true,
            animation: {
                type: 'slide',
                direction: 'left',
                duration: 8000
            }
        },
        defaults: {
            flex: 1
        },
        items: [{
            docked: 'top',
            xtype: 'toolbar',
            ui: 'light',
            title: 'Ya',
            itemId: 'toolbarConfigView',
            items: [{
                xtype: 'button',
                ui: 'back',
                text: 'Voltar',
                action: 'voltarConfigView',
                itemId: 'myConfigViewVoltarBt'
            }]
        }, {
            xtype: 'formpanel',
            itemId: 'fieldSetAssalto',
            items: [{
                xtype: 'fieldset',
                title: 'Ya',
                model: 'MyApp.model.MyModel',
                items: [{
                    xtype: 'textfield',
                    name: 'numeroTelefone',
                    label: 'Ya'
                }, {
                    xtype: 'textfield',
                    name: 'mensagem',
                    label: 'Ya'
                }]
            }]
        }, {
            xtype: 'formpanel',
            itemId: 'fieldSetIncendio',
            items: [{
                xtype: 'fieldset',
                title: 'Ya',
                model: 'MyApp.model.MyModel',

                items: [{
                    xtype: 'textfield',
                    name: 'numeroTelefone',
                    label: 'Ya'
                }, {
                    xtype: 'textfield',
                    name: 'mensagem',
                    label: 'Ya'
                }]
            }]
        }, {
            xtype: 'formpanel',
            itemId: 'fieldSetSequestro',
            items: [{
                xtype: 'fieldset',
                title: 'Ya',

                model: 'MyApp.model.MyModel',


                items: [{
                    xtype: 'textfield',
                    name: 'numeroTelefone',
                    label: 'Ya'
                }, {
                    xtype: 'textfield',
                    name: 'mensagem',
                    label: 'Ya'
                }]
            }]
        }, {
            xtype: 'formpanel',
            itemId: 'fieldSetEmedico',
            items: [{
                xtype: 'fieldset',
                title: 'Ya',

                model: 'MyApp.model.MyModel',


                items: [{
                    xtype: 'textfield',
                    name: 'numeroTelefone',
                    label: 'Ya'
                }, {
                    xtype: 'textfield',
                    name: 'mensagem',
                    label: 'Ya'
                }]
            }]
        }, {
            xtype: 'formpanel',
            itemId: 'fieldSetAcidente',
            items: [{
                xtype: 'fieldset',
                title: 'Ya',
                model: 'MyApp.model.MyModel',
                items: [{
                    xtype: 'textfield',
                    name: 'numeroTelefone',
                    label: 'Ya'
                }, {
                    xtype: 'textfield',
                    name: 'mensagem',
                    label: 'Ya'
                }, {
                    xtype: 'button',
                    ui: 'confirm',
                    text: 'Save'
                }]
            }]
        }]
    }
});

Answer 1

你的意思是拖动滚动？

如果是，请尝试：

scrollable: false

Answer 2

我有类似的情况，所以我在元素中添加了一些指示符属性，告诉它是否可拖动，在dragstart事件中我检查目标元素是否可拖动，如果不是我停止拖动。我的方法看起来像这样：

    moreOptionsPanel.element.on("dragstart", function(evt){
        var isdraggable = event.target.getAttribute("isdraggable");
        if(isdraggable == "false")
        {
                var draggable = moreOptionsPanel.draggableBehavior.getDraggable();
                draggable.isDragging = false;
        }
    });

您应该可以将isdraggable : false放在面板中，或者如果您有html，则可以将其作为属性并进行检查。基本上你需要设置一些微分器，ondragstart你可以看到该元素或其任何一个父元素是否可拖动。

如何禁用拖动vbox子组件（SENCHA TOUCH 2）

2 个答案: