java - 使用 css 在 Vaadin 中设置样式

Question

我正在尝试编辑 Vaadin 中文本字段的文本.我创建了一个仅包含以下信息的文件 (\WebContent\VAADIN\themes\loginthemes\style.css):

textstyle      {  
   font-family: HelveticaRounded; 
   font-size: 40px;
   font-style: bold;
}

在我的 java 文件中有以下内容:

TextField username = new TextField("Username: ");
username.setStyleName("style");
// I also tried username.setStyleName("loginthemes");

文本字段的文本保持不变。

Answer 1

正如 Jan Galinski 所说，您应该定义一个合适的主题。对于名为“logintheme”的一个，您应该将 VAADIN/theme/logintheme/style.scss 创建为:

@import "../reindeer/reindeer.scss";
.logintheme {
    @include reindeer;

    .textstyle {  
        font-family: HelveticaRounded; 
        font-size: 40px;
        font-style: bold;
    }
}

告诉 UI 使用它:

@Theme("logintheme")
    public class MyUI extends UI {
}

此外，您对 setStyleName() 的用法不正确:参数是您的 CSS 类的名称，而不是主题的名称。所以在你的情况下，它应该是:

TextField username = new TextField("Username: ");
username.setStyleName("textstyle");