Как расширить компоненты в Vaadin? - PullRequest
0 голосов
/ 16 января 2019

SpringBoot 2 Vaadin 12.0.3

Я потратил некоторое время на просмотр видеоуроков и изучение онлайн-примеров Ваадина. К сожалению, так много изменилось, что вариантов, которые я надеялся попробовать, больше нет.

  • CssLayout больше не существует - заменяется на Div, который не выставляет expand(Component).
  • component.setWidth("300") не имеет никакого эффекта.
  • component.setWidth("300", UNIT.*) не работает, потому что UNIT не в пути к классам.
  • component.setWidth("300px") работает, но это далеко не элегантно, и установка явной ширины для компонента, который отображает текст, далека от идеала.

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

  • Поле со списком должно расширяться до ширины самой длинной метки.
  • Текстовое поле должно расширяться до доступной недвижимости. (Доступная ширина - ширина поля со списком - ширина кнопки поиска)
  • Кнопка поиска должна расширяться до ширины значка и метки без каких-либо переносов.

Достигается ли это при использовании контракта Vaadin 12 Layout / Component или мне нужно потратить время на определение такого контроля в файле CSS?

1 Ответ

0 голосов
/ 17 января 2019

Ваш вопрос подразумевает, что был бы тривиальный способ достижения вашего варианта использования с помощью встроенных макетов в Vaadin 7 или Vaadin 8 без использования CSS. То, что вы описываете при автоматическом переключении между горизонтальным и вертикальным режимами в зависимости от размера экрана, звучит как нечто, требующее определенной степени адаптивного макета, что обычно подразумевает непосредственное использование CSS.

То, что вы могли бы сделать в более старых версиях, - это иметь логику Java, которая использует VerticalLayout или HorizontalLayout в зависимости от ситуации. Эти два класса все еще доступны для одного и того же вида использования. API-интерфейсы были изменены, чтобы лучше соответствовать базовой функциональности flexbox, но общая функциональность остается прежней.

Вы также можете просмотреть FormLayout (часть базовой платформы) или Board макет (отдельное дополнение), которые оба предоставляют некоторую адаптивную функциональность. Однако они изначально предназначены для слегка отличающихся вариантов использования (соответственно, форм и панелей мониторинга), поэтому может быть немного сложным привести их в соответствие с вашими точными требованиями.

...