Как создать перетаскиваемое окно ExtJS5?

Мне нужно создать окно, которое всегда будет видно, если только оно не будет скрыто путем нажатия на значок. Щелчок по этому значку во второй раз заставит окно снова появиться. Значок должен быть закреплен в верхнем левом углу окна и за его пределами. Я планирую создать окно без заголовка и с двумя элементами: 1: кнопка для скрытия/отображения и 2: фактическая панель. Скрипку можно найти по адресу: https://fiddle.sencha.com/#fiddle/bi7 Мне нужно сделать часть за кнопкой прозрачной. Есть ли способ сделать это?


extjs extjs5
person user1640256    schedule 09.10.2014    source источник
comment
Я думаю, вам нужно работать с css.. когда вы нажимаете кнопку «Показать», измените css, чтобы сделать панель видимой, чтобы она отображалась… аналогичным образом измените css, чтобы скрыть.. при этом не делайте никаких изменений для кнопки   -  person Surya Prakash Tumma    schedule 10.10.2014

Ответы (1)


arrow_upward
0
arrow_downward

Вы бы сделали это вручную, в идеале с классами CSS. Следующее является грубым, с использованием встроенного стиля, но работает. Добавьте к кнопке следующий атрибут listeners.

{
    xtype: 'button',
    ...
    listeners: {
        click: function(){
            var panel = Ext.getCmp("togglePanel");
            if (panel.el.dom.style.display == "none") {
                 panel.el.dom.style.display = "block";
            } else {
                 panel.el.dom.style.display = "none";
            }
        }
     }
 }

и включите id 'togglePanel в зеленую панель, содержащую ползунок

id: "togglePanel",

Нажатие на кнопку покажет/скроет вашу панель

person Lesley.Oakey    schedule 23.10.2014