gwt 中 uibinder 的动态值

Question

我是 GWT 的新手，正在尝试创建一个试图继承复合小部件但复合小部件的值是动态的页面。

我的主页有点像：

         .....
         .....
         <g:Button>Open composite widget</g:button>
         .....
         .....

正在打开另一个弹出面板，类似于：

         .....
         <table>
            <tr><td>Top: <myCompany:userMeasurementUnit/> </td></tr>
            <tr><td>Bottom: <myCompany:userMeasurementUnit/> </td></tr>
            <tr><td>Left: <myCompany:userMeasurementUnit/> </td></tr>
            <tr><td>Right: <myCompany:userMeasurementUnit/> </td></tr>
        </table>

上面应该告诉我们

         top (cm)
         bottom (cm)
         left (cm)
         right (cm)

但我不知道如何将值从主页传递到自定义小部件，即 usermeasurementunit

          <myCompany:userMeasurementUnit/>

我的 usermeasurementunit 是这样的：

UIBinder：

     <htmlpanel tag="span" ui:field="unit"/>

复合小部件是

      usermeasurementunit extends Composite {

       public usermeasurementunit(){
           initwidget...
       }

       public onload() { 
         ...
       }

       }

现在我想在单击按钮时传递任何测量单位厘米、英寸或米。我使用事件总线进行了尝试，但它没有帮助，因为当我单击按钮时弹出面板不在屏幕上并且它没有捕获事件。如果你们中的任何人可以在这方面帮助我，我将非常感激，因为我真的在这件事上苦苦挣扎。

亲切的问候

Answer 1

首先，你需要了解GWT中的对象实例化流程。

他们称之为“延迟绑定”，而不是“动态绑定”。

Uibinder xml 文件是一个布局模板。而它背后的 JAva 源 bean 在一般编程术语中被称为“代码隐藏”。

uibinder 布局模板的作用或目的是减轻布局的负担（在互联网上，许多非英语程序员编写“布局”，虽然语法上很有趣，但它是同样的事情），以便代码隐藏可以专注于控制布局的响应。

这类似于 MVP 的态度。视图实现与演示控制分离。您甚至可以在不确切知道这些字段的布局位置的情况下编写代码隐藏错误。您甚至可以简单地提供一个模板，其中 ui 元素没有正确布局，以便首先专注于您的代码隐藏。也许在那之后。一个 uibinder 模板用于移动设备，另一个用于桌面 - 但它们可以共享相同的代码隐藏。

受 uibinder 模板影响的显示值是在 uibind 期间一次性确定的。没有将 uibinder 字段动态绑定到代码隐藏中声明的对象/变量的不断变化的值。

要在 uibind 之后动态更改/传播 uibinder 字段的值，您必须有意在代码隐藏中设置其值或编写侦听器来检测其更改。

public class Graceland {

  @UiField
  Label pressure;

  @UiField
  Button reset;

  public void setPressure(int value) {
    pressure.setText(value);
  }

  @UiHandler("reset")
  void nameDoesNotMatter(ClickEvent ev) {
    pressure.setText(default);
  }
}

GWT.create() 在编译期间为模板生成 Java 源代码。 GWT.create 不是运行时函数。

@UiField 和@UiHandler 在uibind 时绑定到模板中的uifield。

uibind() 的作用主要不是运行时，而是编译时。虽然它的最终性是在运行时实现的，但所有用于构造对象的 javascript 代码和相应的值都是在编译时生成的，并且在运行时的 uibind 期间执行一次且仅执行一次。

因此，我们的目的并不是要能够完全取代代码隐藏的动态角色，而只是将其从布局任务中解放出来，这样我们程序员就可以拥有一段干净的代码隐藏尽可能少地被布局的意大利面条源弄脏。

但是，如果您希望在绑定期间“动态”影响 uibinder 字段的值，那么 Ui:with 是您的朋友。

package z.mambazo;
public class Graceland {
  ....
  String initialPressure(){
    /* "dynamically" obtain the pressure from the
     * pressure gauge in the petroleum distillation stack
     * during uibind
     */
  }
}

Graceland.ui.xml：

<ui:UiBinder blah...blah>
  <ui:with type="z.mambazo" field="zulu"/>
  <g:VerticalPanel>
    <g:Label
      ui:field="pressure"
      text="the temperature is :{zulu.initialPressure}"/>
  </g:VerticalPanel>
</ui:UiBinder>

ui:with bean 不必是模板的代码隐藏。 ui:with bean 有一个无参数构造函数，或者您必须提供 ui:with 标记，其属性对应于构造函数参数。

您必须注意，为了使用 ui:with，init 值必须在 value 属性中声明，而不是在标签文本中。

<g:Label
  ui:field="pressure"
  text="the temperature is : {zulu.initialPressure}"/>

没有

<g:Label ui:field="pressure">
  the temperature is : {zulu.initialPressure}
</g:Label>

第二种方式，将简单地复制文本。

但是，您也可以这样做：

<g:HtmlPanel>
  the temperature is :&nbsp;
  <g:Label ui:field="pressure"
    text="{zulu.initialPressure}"/>
</g:HtmlPanel>

另外，请注意，所有 GWT UI Java 代码，甚至是临时生成的代码，都被翻译成浏览器 Javascript。因此，您使用 ui:with 引用的任何类都必须是 Java 源代码而不是 Java 字节码。而且那些源代码在任何时候都不能在调用链中调用字节码。

Answer 2

您需要的是shared resources。这是一个例子：

MeasurementConstants.java：

package com.acme.client;

public class MeasurementConstants {

    private final String measurementUnit;

    public MeasurementConstants(String measurementUnit) {
        this.measurementUnit = measurementUnit;
    }

    public String measurementUnit() {
        return measurementUnit;
    }

}

UiBinderMeasurement.java：

package com.acme.client;

import com.google.gwt.core.client.GWT;
import com.google.gwt.uibinder.client.UiBinder;
import com.google.gwt.uibinder.client.UiFactory;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.Widget;

public class UiBinderMeasurement extends Composite {

    private static UiBinderI18nUiBinder uiBinder = GWT
            .create(UiBinderI18nUiBinder.class);
    private MeasurementConstants constants;

    interface UiBinderI18nUiBinder extends UiBinder<Widget, UiBinderMeasurement> {
    }

    public UiBinderMeasurement(MeasurementConstants constants) {
        this.constants = constants;
        initWidget(uiBinder.createAndBindUi(this));
    }

    @UiFactory
    public MeasurementConstants getConstants() {
        return constants;
    }

}

UiBinderMeasurement.ui.xml：

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
    xmlns:g="urn:import:com.google.gwt.user.client.ui">

    <ui:with type="com.acme.client.MeasurementConstants" field="constants"></ui:with>

    <g:HTMLPanel>
        <table>
            <tr><td><g:Label text="Top ({constants.measurementUnit}):" /> </td></tr>
            <tr><td><g:Label text="Bottom ({constants.measurementUnit}):" /> </td></tr>
            <tr><td><g:Label text="Left ({constants.measurementUnit}):" /> </td></tr>
            <tr><td><g:Label text="Right ({constants.measurementUnit}):" /> </td></tr>
        </table>
    </g:HTMLPanel>
</ui:UiBinder>

现在你可以这样称呼它：

new UiBinderMeasurement(new MeasurementConstants("cm"))