css - 更改 vaadin 中的样式定义

Question

我有动态隐藏组件的代码；它使用 [component].addStyleName("name") 向组件添加样式，并且定义该样式以隐藏组件。

我有一个包含大量组件的页面；我可以将它们放在一个数组中并执行此操作，但我希望采用不同的方式。我想为所有这些组件分配它们自己的样式 - 类似于“costPanel” - 然后使用服务器端 vaadin 代码在运行时更改样式“costPanel”的定义。

Vaadin 中的 Page.Styles 类没有获取现有样式或更改现有样式的方法——唯一的方法是添加它们。

这在 Vaadin 中是否可行，即使我必须在客户端为此做一些事情？

Answer 1

这可能最适合作为评论，但它并不适合放在那里。

不是想高高在上，但听起来您正试图以一种非常复杂的方式重新发明轮子。 component.setVisible(false) 将完全满足您的需求，因为组件不会占用任何空间，因为它实际上并不存在于 DOM 本身中。看看下面的例子:

代码:

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);
    }
}

结果:

还有什么我想念的吗？