Problem with the Alignement of Buttons

Hello,
I have a Problem regarding the Alignement of Buttons in a HorizontalLayout. I want to align one Button on the right side and another on the left.

Here is my Code:

[code]
protected Component buildDefaultBottomLayout() {
HorizontalLayout buttonLayout = new HorizontalLayout();
buttonLayout.setSpacing(true);
buttonLayout.addStyleName(ValoTheme.WINDOW_BOTTOM_TOOLBAR);
buttonLayout.setWidth(“100%”);

Button clear = new Button(“Clear all filters”);
clear.addClickListener(event → {
mTable.clearFilters();

});
buttonLayout.addComponent(clear);
if (VaadinSession.getCurrent().getAttribute(User.class).hasPermission(300)) {
Button add = new Button(“Add”);
add.addStyleName(ValoTheme.BUTTON_FRIENDLY);
add.addClickListener(event → {
getUI().addWindow(getAddDialog());
});
buttonLayout.addComponent(add);
buttonLayout.setComponentAlignment(add, Alignment.TOP_LEFT);
}
buttonLayout.setComponentAlignment(clear, Alignment.TOP_RIGHT);
return buttonLayout;
}
[/code]However both Buttons are positioned in the middle of the HorizontalLayout.

Thanks for any help!

22104.png

Is there anyone able to help me?
According to the Book it should work with setSpacing(true) but, as you can see, it is not helping.

In the attachment of my post is a picture where you can see the Buttons, but I want one of them on the right side and the other one the left.

You added the clear button first, so it is aligned topRight in the left half of the layout, and the add button is aligned top left in the right half of the layout.

Components are alway added from left to right in the order you add them to a vertical layout.
Setting the alignment does only change the alignment within the slot of the layout your component occupies,

if you first add the add button, and then later add the clear button, your layout will work as expected

Thank you very much!