Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
Form Alignment
Hi, I'm trying to do this:
setComponentAlignment(userForm, Alignment.BOTTOM_RIGHT);
but it's not working, is there a way to do this? Is it necessary to add the form to a new Layout and set the layout alignment instead?
Bruno Ferreira Pinto: Hi, I'm trying to do this:
setComponentAlignment(userForm, Alignment.BOTTOM_RIGHT);but it's not working, is there a way to do this? Is it necessary to add the form to a new Layout and set the layout alignment instead?
Looks correct to be, you should call that method for the parent layout, so it will look something like this
VerticalLayout layout = new VerticalLayout()
...
layout.setComponentAlignment(userForm, Alignment.BOTTOM_RIGHT);
The next thing you should check is the parent layout's size, have you defined a height for it? If you haven't, then the layout won't take more space than what it needs, which means that aligning the form to the bottom won't have any effect. Try adding this
layout.setSizeFull();
Unfortunatelly, my layout does have setSizeFull();
public LoginWindow() {
super("Entrar");
setHeight("300px");
setWidth("400px");
setModal(true);
initComponents();
addActionHandler(this);
userSessionMB.addLoginListener(this);
}
private void initComponents() {
VerticalLayout mainLayout = new VerticalLayout();
mainLayout.setSpacing(true);
[b]mainLayout.setSizeFull();[/b]
initLoginForm(mainLayout);
initRegistrationLayout(mainLayout);
addComponent(mainLayout);
}
private void initLoginForm(AbstractOrderedLayout mainLayout) {
loginForm = new UserForm();
loginForm.setVisibleItemProperties(Arrays.asList(new String[]{"email", "password"}));
loginForm.getField("email").focus();
HorizontalLayout buttonLayout = new HorizontalLayout();
buttonLayout.setSpacing(true);
loginButton = new Button("Entrar", this);
cancelLoginButton = new Button("Cancelar", this);
buttonLayout.addComponent(loginButton);
buttonLayout.addComponent(cancelLoginButton);
[b]mainLayout.addComponent(loginForm);
mainLayout.setComponentAlignment(loginForm, Alignment.MIDDLE_CENTER);[/b]
mainLayout.addComponent(buttonLayout);
mainLayout.setComponentAlignment(buttonLayout, Alignment.MIDDLE_CENTER);
}
A bit old thread with a now almost classical error. Every window contains a component container (e.g. a layout). This can be set using window.setContent(). In your example the content of the window is not 100% high, thus the alignments won't work. Opening the application using "?debug" and running analyze layouts will also tell you this.
Fix: Change addComponent(mainLayout); to setContent(mainLayout).
Hi,
i read about form alignment, but I'm not able to set my form position.
I'm using a VerticalLayout on which I need to add the form.
This form use a FormLayout as shown in the following code:
public class SampleForm extends Form {
private FormLayout mainFormLayout;
public SampleForm() {
initLayout();
setLayout(mainFormLayout);
}
private void initLayout() {
mainFormLayout = new FormLayout();
mainFormLayout.setSpacing(true);
mainFormLayout.setMargin(true);
setFormFieldFactory(new FormFieldFactory() {
......
});
}
}
The form is inserted in a CustomComponent as in the following
public class NewSampleArea extends CustomComponent {
private VerticalLayout verticalLayout;
public NewSampleArea() {
initLayout();
setCompositionRoot(verticalLayout);
}
private void initLayout() {
verticalLayout = new VerticalLayout();
verticalLayout.setSpacing(true);
verticalLayout.setMargin(true);
verticalLayout.setSizeFull();
HorizontalLayout labelLayout = new HorizontalLayout();
labelLayout.setSizeFull();
Label reservedAreaLabel = new Label("AREA RISERVATA");
reservedAreaLabel.addStyleName("section-description-style");
labelLayout.addComponent(reservedAreaLabel);
labelLayout.setComponentAlignment(reservedAreaLabel,
Alignment.MIDDLE_RIGHT);
verticalLayout.addComponent(labelLayout);
VerticalLayout formLayout = new VerticalLayout();
formLayout.setSpacing(true);
Form sampleForm = new SampleForm();
sampleForm.setItemDataSource(prepareItem());
formLayoUt.addComponent(sampleForm);
formLayout.setComponentAlignment(sampleForm, Alignment.MIDDLE_CENTER);
verticalLayout.addComponent(formLayout);
verticalLayout.setComponentAlignment(formLayout,
Alignment.MIDDLE_CENTER);
....
}
....
}
I see the form in the layout, but it has a left alignment instead of a centered one.
Can anyone help me to resolve the issue?
Thanks in advance.