Горизонтальные и вертикальные макеты не реагируют на Vaadin 12
Насколько я понимаю, одной из главных тем Vaadin 10+ была адаптивная верстка. Поэтому я был удивлен, когда "Горизонтальная компоновка" и "Вертикальная компоновка" не поддерживают адаптивный дизайн. (Я перешел на использование App Layout, и это, кажется, работает.) ОДНАКО, в моем макете приложения, я склонен использовать вертикальные макеты и горизонтальные макеты для размещения полимерных компонентов - я предполагаю, что они НЕ будут отзывчивыми, так как я не Не думаю, что горизонтальные / вертикальные макеты Vaadin следуют за отзывчивой темой. Есть ли альтернативный компонент макета, который мы должны использовать, который более или менее реализует "горизонтальный макет, который реагирует" и т. Д.?
В связи с этим разумно предположить, что все готовые полимерные компоненты Vaadin 10/12+ (кроме горизонтальной и вертикальной компоновки) автоматически реагируют, такие как сетка, формы и вкладки, так что, например, если пользователь находится на его телефоне и ищет вкладку, которая имеет формы, которые эти компоненты Vaadin будут "красиво" отображать (т. е. следуя адаптивному расположению других фреймворков, таких как response.js) на телефоне?
1 ответ
Горизонтальное или вертикальное расположение по определению не отвечает. Его целью является размещение всех дочерних элементов на одной и той же линии, вертикально или горизонтально, независимо от размера экрана.
Отдельные компоненты в Vaadin 10 и новее реагируют в случае необходимости. Например, всплывающее окно календаря в средстве выбора даты автоматически переключается между полноэкранным и обычным режимом в зависимости от используемого устройства. Другие компоненты, такие как Grid, не могут знать, что подходит в любом конкретном случае. Вместо этого разработчик приложения должен, например, настроить, какие столбцы использовать в зависимости от обстоятельств.
Расположение различных компонентов относительно друг друга в зависимости от размера экрана всегда зависит от дизайна приложения, который не может быть обработан общими компонентами. Есть некоторые компоненты, которые помогают достичь этого в некоторых конкретных случаях, например, макет формы, макет приложения и плата.
Если общие шаблоны, предлагаемые предоставленными макетами, не подходят, то разработчику приложения необходимо вручную настроить компоненты по-разному в зависимости от случая или написать CSS, который адаптируется к размеру экрана. Это все еще намного проще в Vaadin 10+ по сравнению со старой версией, поскольку более старые версии в значительной степени полагались на пиксельные вычисления, которые применялись как встроенные стили, что противоречило попыткам более динамических определений, примененных в CSS.