Я пытаюсь выровнять по вертикали в пределах HorizontalLayout в Vaadin 12.
В большинстве приложений, которые я могу себе представить, имеет смысл расположить виджеты вдоль базовой линии текстовых полей, поскольку текстовые поля имеют тенденцию управлять макетом большинства приложений, и особенно бизнес-приложений.
Так что я был рад найти FlexComponent.Alignment.BASELINE, предложенный для HorizontalLayout.Но когда я попробовал это в приложении Vaadin 12.0.2, базовая линия, кажется, все , кроме текстовое поле.
HorizontalLayout bars, one for each value in the FlexComponent.Alignment enum">
Вот пример приложения.Я загрузил сгенерированный базовый стартер и ничего не трогал, кроме содержимого конструктора MainView.
Приложение состоит из VerticalLayout, состоящего из шести HorizontalLayout объектов.Каждая горизонтальная полоса - это Label, TextField, Button и Button.Ярлык и первая кнопка имеют вертикальное выравнивание, установленное явно.
Используйте край другого окна поверх окна, которое вы сейчас просматриваете, используя его верхний край, как линейку.Обратите внимание, как выглядит строка «BASELINE», чтобы выровнять явно установленные виджеты (метка и первая кнопка) с базовой линией заголовка поля, а не самого поля, и с базовой линией текста последней кнопки.
Итак, выравнивание BASELINE выравнивает базовую линию всего , но текстового поля.Это прямо противоположно тому, что я ожидаю и нуждаюсь.
➥ Это функция или ошибка?
➥ Я что-то не так делаю?
➥ Есть ли способ заставить виджеты выровняться с базовой линией TextField?
Как незначительная дополнительная проблема, STRETCH, похоже, не имеет никакого эффекта.Что он должен делать?
Код
package work.basil.example.bugsy;
import com.vaadin.flow.component.button.Button;
import com.vaadin.flow.component.html.Label;
import com.vaadin.flow.component.orderedlayout.FlexComponent;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
import com.vaadin.flow.component.orderedlayout.VerticalLayout;
import com.vaadin.flow.component.textfield.TextField;
import com.vaadin.flow.router.Route;
import com.vaadin.flow.server.PWA;
/**
* The main view contains a button and a click listener.
*/
@Route ( "" )
@PWA ( name = "Project Base for Vaadin Flow",
shortName = "Project Base" )
public class MainView extends VerticalLayout {
public MainView () {
this.setSpacing( true );
this.setMargin( true );
for ( FlexComponent.Alignment a : FlexComponent.Alignment.values() ) {
Label label = new Label( a.name() );
TextField field = new TextField( "field" );
Button alignedButton = new Button( "aligned" );
Button unalignedButton = new Button( "unaligned" );
HorizontalLayout horizontalLayout = new HorizontalLayout();
horizontalLayout.add( label , field , alignedButton , unalignedButton );
// Set vertial alignment of the label and the first button.
horizontalLayout.setVerticalComponentAlignment( a , label );
horizontalLayout.setVerticalComponentAlignment( a , alignedButton );
this.add( horizontalLayout );
}
}
}