Показать и скрыть панель при нажатии кнопки

введите здесь описание изображения

Как видно на изображении, у меня есть кнопка «Скрыть». При нажатии кнопки «Скрыть» я хочу, чтобы левая панель была скрыта, а правая панель покрывала 100% экрана. При этом кнопка «скрыть» изменится, чтобы показать, где панель возвращается в исходное положение.

За то же самое

xtype:'toolbar',
            docked:'top',
            items:[
                {
                    cls:'hide',
                    xtype:'button',
                    text:"Hide",
                    iconMask:true,
                    ui:'back',
                    id:'hide',
                    handler:function () {

                        var viewWidth = Ext.Viewport.getWindowWidth();
                        alert(viewWidth);
                        desiredWidth = Math.min(viewWidth, 400) - 10;
                        Ext.fly('protocol').setStyle('width', desiredWidth); ;

                    }
                },

Я попробовал приведенный выше код для динамического изменения ширины панели, но Ext.fly, похоже, не работает. Что может быть решением этого?

Любая помощь приветствуется.


show-hide panel sencha-touch-2
person Khush    schedule 26.04.2012    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Будет оценена подсветка левой панели.

Однако, просто глядя на ваше изображение, я делаю предположение. Если все, что вы хотите скрыть, это левая панель, содержащая следующие

Мое предположение о том, что такое левая панель

Тогда, возможно, вы можете сделать переключение jQuery после объявления панелей LEFT и RIGHT, например, в теге html "DIV". См. ссылку ниже.

JQuery API для переключения

Кроме того, если вы используете библиотеку или инструмент Javascript для создания этого, вы можете получить исходный код Javascript и погрузиться в него.

По моему опыту, намного проще написать функцию Javascript самостоятельно, чем использовать что-то готовое.

person Zac    schedule 26.04.2012
comment
Начнем с того, что да, вы правы. Это панель, которую я хочу скрыть. Я использую Sencha touch 2 для создания этого, и javascript, используемый в sencha, отличается от остальных. Я не уверен, как я могу объединить код jquery в javascript Sencha, чтобы скрыть панель. - person Khush; 26.04.2012

arrow_upward
0
arrow_downward

Ext.getCmp('workItemPanel').hide();

хорошо работал для меня.

person Khush    schedule 26.04.2012