是否可以在 Vaadin 8 中更改 CustomComponent 标题的样式

Posted 2023-02-23

【中文标题】是否可以在 Vaadin 8 中更改 CustomComponent 标题的样式

【英文标题】：Is it possible to change the style of CustomComponent caption in Vaadin 8

【发布时间】：2018-04-09 23:49:23

【问题描述】：

我在 Vaadin 的 VerticalLayout 中使用 CustomComponent。我想将标题的样式更改为粗体，但它不起作用。

我的班级如下：

公共类 MyTab 扩展 CustomComponent 实现 UpdatableComponent

    public MyTab() 

        HorizontalSplitPanel panel = new HorizontalSplitPanel();
        panel.setSplitPosition(218, Unit.PIXELS);
        panel.setFirstComponent(createFirstPanelComponent());
        panel.setSecondComponent(createSecondPanelComponent());
        panel.setLocked(true);
        panel.addStyleName("has_border");
        setCaption("This is my title");
        addStyleName("padding-bottom-10px");
        addStyleName("bold-caption");
        
        setSizeFull();
        setCompositionRoot(panel);
    

我已经在我的 scss 文件中尝试了“粗体标题”的这些定义。他们都没有工作：

.bold-caption 字体粗细：加粗！重要； .bold-caption.v-caption 字体粗细：加粗！重要； .bold-caption.v-caption.v-captiontext 字体粗细：加粗！重要； .bold-caption .v-caption 字体粗细：加粗！重要；

主要问题也是如何在不同布局中的 Vaadin 中为自定义组件的标题设置样式？ 有什么解决办法吗？

【参考方案1】：

我想通了。 我用过：

.v-caption.bold-caption 
    font-weight: bolder !important;
  

如果您使用 Vaadin 插件，请不要忘记删除缓存并构建应用程序。