gxt将图像与组合框对齐

Question

我有一个loading.gif图片，需要与组合框对齐

<container:VerticalLayoutContainer addStyleNames="{mystyle}">
    <form:FieldLabel text="{constants.typ}" labelAlign="TOP">
        <form:widget>
            <form:ComboBox ui:field="type" width="300" allowBlank="true" forceSelection="true" triggerAction="ALL" />
        </form:widget>
    </form:FieldLabel>
    <g:Image resource="{loadingGif}" ui:field="Monimage" />
</container:VerticalLayoutContainer>

在我看来，我有一个用于存储数据的列表存储。 我试图将图像放在<form:widget>但它引发了一个异常，即每个ui：child只能有一个元素。

有了这段代码，我的图像就在组合框的下面，我需要在它的右侧。 有谁能够帮助我？

Answer 1

当uiBinder解析器看到<form:widget> ，它将尝试调用FieldLabel#setWidget(theComponentUnderTheTag) 。

这就是为什么在<form:widget>标记下包含多个元素没有意义的原因。

当我无法使用GWT做我想做的事情时，我会回退到一些普通的旧HTML。 使用uiBinder，您可以使用HTMLPanel实现此目的 ：

<container:VerticalLayoutContainer addStyleNames="{mystyle}">
  <form:FieldLabel text="{constants.typ}" labelAlign="TOP">
    <form:widget>

      <g:HTMLPanel>
      <!--
        Here, I can now place plain old HTML :) 
        Let's place the 2 components via 2 divs and a float:left.
      -->
        <div style="float:left">
          <form:ComboBox ui:field="type" width="300" allowBlank="true" forceSelection="true" triggerAction="ALL" />
        </div>
        <div>
          <g:Image resource="{loadingGif}" ui:field="Monimage" />                                          
        </div>
      </g:HTMLPanel>

    </form:widget>
  </form:FieldLabel>
</container:VerticalLayoutContainer>

如果不想使用HTML面板，则可以将两个元素都放在<form:widget>标记中。

但是要实现这一点，您需要将它们包装在一个组件中（例如， Horizo​​ntalPanel ），因为您只能在<form:widget>下放置一个小<form:widget> 。

<form:FieldLabel text="{constants.typ}" labelAlign="TOP">
    <form:widget>
        <g:HorizontalPanel>
          <g:ComboBox ui:field="type" width="300" allowBlank="true" forceSelection="true" triggerAction="ALL" />
          <g:Image resource="{loadingGif}" ui:field="Monimage" />
        </g:HorizontalPanel>
    </form:widget>
</form:FieldLabel>