CssResource的例子?

时间:2010-04-23 10:14:25

标签: gwt

我正在迁移到使用CssResource。 但是,我不明白如何使用前缀样式:( ...类似于:

.prefix .label {
 padding: 10px;
}

.prefix .button {
 padding: 20px;
}

我如何将其转换为CssResource类并在代码中使用它:(... 我正在玩@Import@ImportedWithPrex@Share,但这有点令人困惑,文档很难理解:( ... 请帮帮忙?

1 个答案:

答案 0 :(得分:1)

以下是一些演示ImportedWithPrefix注释

用法的代码
 interface Bundle extends ClientBundle {
    @Source("CssImportScopeSample.css")
    InnerStyle innerStyle();

    @Source("CssImportScopeSample.css")
    OuterStyle style();
  }

  @ImportedWithPrefix("inner")
  interface InnerStyle extends Style {
  }

  @ImportedWithPrefix("outer")
  interface OuterStyle extends Style {
  }

  interface Style extends CssResource {
    String body();
  }

还有一个小的UiBinder代码..

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder' >
  <ui:with field='bundle' type='com.google.gwt.uibinder.test.client.CssImportScopeSample.Bundle' />

  <ui:style import='com.google.gwt.uibinder.test.client.CssImportScopeSample.OuterStyle
        com.google.gwt.uibinder.test.client.CssImportScopeSample.InnerStyle'>
    .outer-body .inner-body { width: 100px; background-color: red; }   
  </ui:style>

  <div class='{bundle.style.body}'> 
    <span ui:field='outer'/>
    <div ui:field='inner' class='{bundle.innerStyle.body}'>Inner!</div>
  </div>
</ui:UiBinder>

希望这能让你走上正轨......