如何使用 GWT 以编程方式在 CSS 类中设置宽度？答案

【问题标题】：How to set width in CSS class programatically with GWT?如何使用 GWT 以编程方式在 CSS 类中设置宽度？
【发布时间】：2018-07-15 00:14:33
【问题描述】：

我正在开发 GWT 应用程序并且我有一个错误：我的按钮浏览（即 FileUploadField 类）的宽度比正常的要大，看看：

当我检查元素并将元素的宽度设置为 20 像素时，一切正常。但我不知道如何在 GWT 中以编程方式设置（CSS 中该类的名称是“x-form-file”），我尝试了一些来自互联网的解决方案，例如：

 fileUploadField = new FileUploadField();
        fileUploadField.setAllowBlank(false);
        fileUploadField.setName("uploadedFile");
        fileUploadField.setFieldLabel("File");
        fileUploadField.getElement().getStyle().setProperty("width", "20px");

但没有成功。有人可以帮助我如何在我的 gwt 代码中以编程方式在 css 中获取该类吗？

【问题讨论】：

标签： java html css gwt gxt

【解决方案1】：

您需要创建一个 CSS 客户端包（一个接口），如下所示：

interface MyCss extends CssResource {
  String className();
}

之后，您需要将此捆绑包作为实例变量放入您的类中：

@UiField MyCss 风格；

然后在您的代码中，您可以使用以下方式添加样式： fileUploadField.addStyleName(style.className())

在代码中使用 css 是某种样板，有关详细示例，请查看 GWT 网站：LINK

【讨论】：

【解决方案2】：

您可以将 .x-form-file { width :20px;} 添加到项目的 style.css 中，这将覆盖该样式。
你可以试试：fileUploadField.getElement().getStyle().setWidth(20, Unit.PX);

拉兹

【讨论】：