CheckboxGroup Vertically

Flow
1

How to print checkboxes from CheckboxGroup vertically insted horizontally. I tried to add this variant:

checkboxGroup.addThemeVariants(CheckboxGroupVariant.LUMO_VERTICAL);

but it doesn’t change anything. I’m working with Vaadin 14.

I copied this code to my app:

CheckboxGroup<String> checkboxGroup = new CheckboxGroup<>();
checkboxGroup.setLabel("Label");
checkboxGroup.setItems("Option one", "Option two", "Option three");
checkboxGroup.addThemeVariants(CheckboxGroupVariant.LUMO_VERTICAL);

Div value = new Div();
value.setText("Select a value");
checkboxGroup.addValueChangeListener(event -> {
    if (event.getValue() == null) {
        value.setText("No option selected");
    } else {
        value.setText("Selected: " + event.getValue());
    }
});

and it didnt change to VerticalLayout, Label didnt show up and ValueChangeListener is not working too :confused:

2

Hi Miłosz

I ran your code in my test view (Vaadin 14.1.18) and everything worked as expected. The checkboxgroup is vertical, its label shows up, and the value change listener works too.

Maybe you have included some custom css that interferes with this? or maybe you aren’t using lumo theme?

3

Update your libraries (mvn clean install)