alter style definition in vaadin

Question

I have code that will hide components dynamically; it uses [component].addStyleName("name") to add a style to a component, and that style is defined to hide the component.

I have a page which will have a large number of components; I can put them in an array and do this, but I'm hoping for a different way. I would like to assign all those components their own style - something like "costPanel" - and then use server-side vaadin code to alter the definition of the style "costPanel" at runtime.

The Page.Styles class in Vaadin has no methods for obtaining existing styles nor altering ones that are there -- the only methods are for adding them.

Is this possible in Vaadin, even if I have to do something on the client side for it?

Answer 1

This is perhaps best suited as a comment, but it does not really fit in there.

Not trying to be patronising, but it sounds like you're trying in a very complicated way to reinvent the wheel. component.setVisible(false) will do exactly what you need, as in the component will not take up any space since it won't actually exist in the DOM itself. Take a look at the example below:

Code:

public class LayoutWithInvisibleComponents extends VerticalLayout {
    private int index = 0;

    public LayoutWithInvisibleComponents() {
        // add a visibility toggling button
        addComponent(new Button("Toggle next", event -> {
            Component component = getComponent(++index);
            if (component instanceof Button) {
                // just toggle the next one if it's a button
                component.setVisible(!component.isVisible());
            }
            if (index == getComponentCount() - 1) {
                // reset counter
                index = 0;
            }
        }));

        // add some invisible dummy buttons
        for (int i = 0; i < 5; i++) {
            Button button = new Button("Button " + i);
            button.setVisible(false);
            addComponent(button);
        }

        // and add a visual delimiter
        Panel rightPanel = new Panel(new Label("---------- some visual delimiter ----------"));
        rightPanel.setSizeFull();
        addComponent(rightPanel);
    }
}

Result:

Is there anything else I'm missing?