如何在GWT Uibinder中的HTML元素中动态添加类

Question

jQuery（例如jQuery）的JavaScript库具有动态添加/删除类元素元素的能力：

$("#some-element").addClass("make-me-pretty");

这很重要，因为它允许您动态地将不同的样式规则应用于这些元素。

在gwt-land中，您可能有一个Uibinder XML摘要：

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
    xmlns:gwt="urn:import:com.google.gwt.user.client.ui">
    <div>
        <span id="">Some content</span>
        <gwt:RadioButton ...>
            ...
        </gwt:RadioButton>
        <!-- etc. -->
    </div>
</ui:UiBinder>

1. 对于非翼展元素，例如<span>，我如何在Java代码中动态添加/删除类？
2. 说到<gwt:RadioButton>，我似乎找不到uibinder XML的GWT参考XSD，或某种官方引用com.google.gwt.* XML的所有元素和属性的法律定义。例如，我在哪里可以找到哪些子元素和属性gwt:RadioButton支持的文档？而不仅仅是一个小部件，所有这些小部件！有人可以将我指向正确的方向吗？

预先感谢！

Answer 1

您可以在gwt-user- <version> .jar中找到uibinder.xsd（至少从2.4.0开始，但我也怀疑较旧的版本）。

至于您的其他问题：您可以随时使用

遍历DOM

yourUi.getElement().getElementsByTagName( "span" )

并与匹配的id找到Element，但这不是很优雅。实际上，我从未遇到过这种情况。这是一个有趣的问题！

希望会有所帮助。

欢呼，

Answer 2

到任何UIObject（包括RadioButton）您可以：

yourUI.addStyleName("your-class");

在GWT中：StyleName = class

更多UIObject方法

Answer 3

我认为您可以做这样的事情。将您的UI字段映射到GWT"盒装"。

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder'>
  <div>
    Hello, <span ui:field='nameSpan'/>.
  </div>
</ui:UiBinder>

在绑定到上述UI.xml文件的类中，您可以按以下方式更改类

      interface MyUiBinder extends UiBinder<DivElement, HelloWorld> {}
      private static MyUiBinder uiBinder = GWT.create(MyUiBinder.class);
      @UiField SpanElement nameSpan;
      public HelloWorld() {
        setElement(uiBinder.createAndBindUi(this));
      }
      public void changeClass(){
           nameSpan.setClassName("newClass");
      }   

Answer 4

我想您有一个HTML页面，将小部件加载到其中。您可以在 **。ui.xml 文件中分配一个类，就像在HTML页面中一样。

<div class="MyClass" align="middle">
    <gwt:VerticalPanel>
              .......
    </gwt:VerticalPanel>
</div>

然后在您中写下您的CSS规则 main.css file。

.MyClass{background-color:black;}

加载视图时， main.css 文件将"查看"类的名称并在其上行动。