Qooxdoo - Мобильная карта охватывает панель инструментов

99
9

Привет, я использовал демонстрацию мобильной карты здесь: http://demo.qooxdoo.org/devel/mobileshowcase/index.html#%2Fmaps

и я пытался добавить панель инструментов в нижней части страницы карты. Он работает, но затем карта быстро закрывает его. Посмотрев на DOM, похоже, что панель инструментов добавляется в div.

Есть ли способ сделать это отображаться поверх карты, а не под ней? Этот код содержится в файле Application.js.

 var maps = test.page.Maps.getInstance();
var manager = new qx.ui.mobile.page.Manager(false);
manager.addDetail([
maps
]);
maps.show();

var toolbar = this.__toolbar = new qx.ui.mobile.toolbar.ToolBar();
maps.add(toolbar);

Спасибо за помощь!

спросил(а) 2021-01-25T12:49:10+03:00 4 месяца, 4 недели назад
1
Решение
100

посмотрите: https://github.com/qooxdoo/qooxdoo/blob/master/application/mobileshowcase/source/class/mobileshowcase/page/Maps.js

В этом примере есть несколько важных вещей. Методы "_createContent" и "_createScrollContainer()" переопределены.

NavigationPage создает по умолчанию контейнер iScroll, в который вы можете поместить все виджеты. Но OpenLayer div - это не виджет qooxdoo, конечно. У этого есть своя логика прокрутки. Вот почему вы должны перезаписать эти методы. Большая часть стиля OpenLayer не может быть изменена. OpenLayer накладывает все содержимое, поскольку оно имеет абсолютное позиционирование.

Но есть решение:

Используйте этот метод в методе initalize()

this.addAfterNavigationBar(widget);

Назначьте класс CSS вашему виджету через

 widget.addCssClass("your-class")

Измените свой "styles.css" в папке ресурса:

.your-class {
z-index: 5000;
position: absolute;
}

Гритц Кристофер

ответил(а) 2021-01-25T12:49:10+03:00 4 месяца, 4 недели назад
45

С maps.add(toolbar) вы добавляете панель инструментов на карту, поэтому ее добавили в div. Думаю, вам нужно пройти через page.Manager, чтобы добавить отдельные элементы в графический интерфейс. Возможно, вы захотите пересмотреть мобильное учебное пособие, в котором будет достигнуто именно это, а также виджет, полученный из NavigationPage, как в витрине карт.

ответил(а) 2021-01-25T12:49:10+03:00 4 месяца, 4 недели назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема