bug with sidemenu in mobile device

Webix JS
1

Добрый день!

Если на мобильном устройстве тыкнуть на любое поле, чтобы появилась экранная клавиатура, а потом открыть выезжающее меню (гамбургер в тулбаре), тогда закрывается экранная клавиатура а само меню не растягивается на всю высоту, а становится высотой = высота экрана - высота экранной клавиатуры, так же иногда получается так, что весь интерфейс становится по ширине выезжающего меню (при схожих манипуляциях как описаны выше, но пока закономерность не могу найти)
http://webix.com/snippet/m/98426613

Так же не подскажите как можно реализовать такое, что когда у выплывающего меню (sidemenu) установлено modal: true то чтобы при нажатии на “затемненую область” меню просто закрывалось?

Спасибо

2

Еще один забавная фича при нажатии на гамбургер меню появляется и исчезает http://webix.com/snippet/5ebba655

3

к комментарию выше, всё при такой же схеме, нажимаем на любое поле чтобы появилась клавиатура а потом с открытой клавиатурой на гамбургер

4

http://webix.com/snippet/8f2e6c5d

Так же странно что если указать ширину у сайдМеню, то всё равно при открытии его способом именно при открытой клавиатуре он будет по ширине 100%

“иногда получается так, что весь интерфейс становится по ширине выезжающего меню” скорее всего причина этого именно в том что написано абзацем выше, только “общую” ширину задает сайдМеню, и поэтому весь интерфейс становится шириной как он

5

Причем на десктопных версиях такого нет

6

Так же забавно что если в браузере девайса тыкнуть флажое “полная версия” то все проблемы исчезают

7

Здравствуйте!

В вашем коде есть странное место:

$$('conteiner').addView(sideMenu);

Sidemenu, как и любое другое окно, не нужно добавлять в layout, это отдельный компонент и лежит он над layout-ом. Именно из-за этой строчки sidemenu пытается подстроится под размеры layout, когда идет пересчет размеров для него.

И еще один момент, который нужно учитывать.

Когда вы кликаете на “гамбургер”, закрывается клавиатура и одновременно появляется sidemenu, которое берет высоту у еще не полноразмерного окна. Чтобы меню подстроилось под высоту окна, можно вызвать adjust в onresize обработчике:

 if($$("menu").isVisible())
      $$("menu").adjust();

Вот ваш обновленный и рабочий сниппет: http://webix.com/snippet/0b669be9

8

Спасибо!