0

我们有一个要求,我们需要隐藏窗口的标题,为此我们正在使用

header:false

但是如果我们使用 header:false,那么窗口就根本不能被拖动。

因此,无论如何,窗口可以通过主体拖动吗?也就是说,如果标题设置为 false 并且没有显示,那么用户也可以以某种方式拖动窗口。

任何建议任何人。

谢谢您的帮助。

PS:ExtJS 4.1 版

4

3 回答 3

2

您可以创建自己的窗口类来更改拖动的初始化方式,在这里我定义了一个完全符合您要求的窗口类。

Ext.define("MyCustomWindowClass", {
   extend: "Ext.window.Window",
   initDraggable: function() {
        var me = this,
            ddConfig;

        if (!me.header) {
            me.updateHeader(true);
        }

        /*
         * Check the header here again. If for whatever reason it wasn't created in
         * updateHeader (we were configured with header: false) then we'll just ignore the rest since the
         * header acts as the drag handle.
         */
        //if (me.header) {
            ddConfig = Ext.applyIf({
                el: me.el//,-Reimius, I commented out the next line that delegates the dragger to the header of the window
                //delegate: '#' + Ext.escapeId(me.header.id)
            }, me.draggable);

            // Add extra configs if Window is specified to be constrained
            /*if (me.constrain || me.constrainHeader) {
                ddConfig.constrain = me.constrain;
                ddConfig.constrainDelegate = me.constrainHeader;
                ddConfig.constrainTo = me.constrainTo || me.container;
            }*/

            /**
             * @property {Ext.util.ComponentDragger} dd
             * If this Window is configured {@link #cfg-draggable}, this property will contain an instance of
             * {@link Ext.util.ComponentDragger} (A subclass of {@link Ext.dd.DragTracker DragTracker}) which handles dragging
             * the Window's DOM Element, and constraining according to the {@link #constrain} and {@link #constrainHeader} .
             *
             * This has implementations of `onBeforeStart`, `onDrag` and `onEnd` which perform the dragging action. If
             * extra logic is needed at these points, use {@link Ext.Function#createInterceptor createInterceptor} or
             * {@link Ext.Function#createSequence createSequence} to augment the existing implementations.
             */
            me.dd = new Ext.util.ComponentDragger(this, ddConfig);
            me.relayEvents(me.dd, ['dragstart', 'drag', 'dragend']);
        //}
    }
});
于 2012-08-28T19:19:01.513 回答
0

您是否尝试过设置 Ext.Component 的“可拖动”配置选项?这将直接将您的 Window 设置为可拖动的,此外,请尝试使用“delegate”选项来指定组件的哪个部分将是句柄。这是文档中的一个示例。

**它从 ExtJs 4 开始可用,所以你很好。

于 2012-09-17T07:02:00.780 回答
0

这是一个非常愚蠢的旁路:

Ext.require([
    'Ext.window.Window'
]);

Ext.onReady(function(){

   Ext.create('Ext.Window', {
       closable: false,
       width: 400,
       height: 200,
       layout: 'fit'
   }).show();

});

在CSS中:

.x-window-header-text {
    height: 2px;
}

我知道它不完全符合您的要求,但标题为可拖动状态的文档是拖动处理程序: http://docs.sencha.com/ext-js/4-1/#!/api/Ext.window。窗口-cfg-可拖动

"True 允许窗口被标题栏拖动"

希望这会有所帮助。

于 2012-08-29T13:10:29.687 回答