GWT Bootstrap Адаптивный дизайн существующего веб-приложения с экранами

Question

У меня есть рабочее веб-приложение, разработанное с помощью GWT. Теперь, когда он должен изменить размер на планшете или меньших экранах, я подумал об использовании GWT Bootstrap. Но у существующего приложения есть только один файл project.html и project.css в папке war. В настоящее время пользовательские интерфейсы не используются. Есть четыре экрана, отображающие различные графики, созданные d3js.

Мой вопрос все еще можно использовать загрузочный GWT для изменения размера? Или как насчет только Bootstrap и использования CSS-файла без каких-либо связывателей пользовательского интерфейса?

Какой подход лучше? Как я запутался и провел пару часов в поисках и чтении.

Answer 1

Если вы планируете взаимодействовать в вашем GWT приложение с компонентами начальной загрузки (т.е. NavBar, Caourselи т. д.) тогда я бы пошел с gwt-bootstrap потому что вам не нужно использовать JSNI и вы получаете безопасность типа.

Если вам не нужно взаимодействовать с этими компонентами или вы используете в основном чистый HTML в вашем приложении GWT вы также можете использовать простой bootstrap и добавьте соответствующие классы.

Пример редактирования кода:

UiBinder:

<b:NavPills>
  <b:AnchorListItem active="true">Item 1</b:AnchorListItem>
  <b:AnchorListItem>Item 2</b:AnchorListItem>
  <b:AnchorListItem>Item 3</b:AnchorListItem>
  <b:AnchorListItem enabled="false">Item 4</b:AnchorListItem>
  <b:AnchorListItem pull="RIGHT">Pulled right</b:AnchorListItem>
</b:NavPills>

Код:

NavPills pills = new NavPills();
AnchorListItem item1 = new AnchorListItem("Item 1");
item1.setActive(true);
pills.add(item1);
pills.add(new AnchorListItem("Item 2");
pills.add(new AnchorListItem("Item 3");
...