gwt - 将背景图像应用到 GWT 装饰器面板

Question

这是我使用 DecoratorPanel 构建的视图。如何修改它以显示背景图像？我看到很多应用 CSS 样式的示例，但我的 CSS 知识有限，所以如果这是要走的路，那么任何人都会有一个如何创建和应用 CSS 样式的工作示例。

这是我的代码 public class EditContactView extends Composite implements EditContactPresenter.Display { private final TextBox firstName; 私人最终文本框姓氏；私有最终 FlexTable detailsTable；

      public EditContactView() {
        DecoratorPanel contentDetailsDecorator = new DecoratorPanel();
        contentDetailsDecorator.setWidth("18em");
        initWidget(contentDetailsDecorator);

        VerticalPanel contentDetailsPanel = new VerticalPanel();
        contentDetailsPanel.setWidth("100%");

        detailsTable = new FlexTable();
        detailsTable.setCellSpacing(0);
        detailsTable.setWidth("100%");         
        firstName = new TextBox();
        lastName = new TextBox();
        initDetailsTable();
        contentDetailsPanel.add(detailsTable);

        HorizontalPanel menuPanel = new HorizontalPanel();
        contentDetailsPanel.add(menuPanel);
        contentDetailsDecorator.add(contentDetailsPanel);
      }

      private void initDetailsTable() {
        detailsTable.setWidget(0, 0, new Label("Firstname"));
        detailsTable.setWidget(0, 1, firstName);
        detailsTable.setWidget(1, 0, new Label("Lastname"));
        detailsTable.setWidget(1, 1, lastName);
        firstName.setFocus(true);
      }

      public HasValue<String> getFirstName() {
        return firstName;
      }

      public HasValue<String> getLastName() {
        return lastName;
      }

      public Widget asWidget() {
        return this;
      }

    }

Answer 1

关于设置样式名称 - 您只需在您希望的任何小部件上调用 setStyleName ("myDecoratedPanelStyle") -示例并检查 gwt 如何在standard.css中添加样式 gwt-TextBox

在您的 .css 文件中添加 .myDecoratedPanelStyle

myDecoratedPanelStyle 
{
   background-image:url('path/paper.gif');
   background-color:#cccccc;
}

另请参考 - https://developers.google.com/web-toolkit/doc/latest/DevGuideUiCss