GWT - 如何在uibinder xml文件中定義外部佈局層次結構中的Widget

Question

這是我的第一篇文章。我希望有人能幫助我。
我正在尋找一種方法來單獨在UiBinder XML佈局文件中定義一個小部件，而不是佈局層次的一部分。 這裏有一個小例子：由於UI

<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" 
xmlns:g="urn:import:com.google.gwt.user.client.ui"> 

<g:Label ui:field="testlabel" text="Hallo" /> 
<g:HTMLPanel>  
... 
</g:HTMLPanel> 

編譯失敗：UiBinder的元素期望只有一個子元素。
在Java代碼中，我將訪問並綁定標籤控件和往常一樣：

@UiField Label testlabel; 

例如，當你定義一個網格或FlexTable這可能是有用的 - 我想定義標籤的內表頭XML佈局文件，而不是在代碼中編程。

提前感謝

Answer 1

對不起，沒有做不到的，只是UiBinder的不支持這種語法。想想看 - 這個Widget會去哪裏？它應該添加到DOM樹嗎？這也使編譯器很難判斷這些代碼是否應該被修剪爲未使用。

您必須等待GWT團隊爲Grid創建自定義標籤（如他們所做的那樣，例如DockLayoutPanel）。但我不希望FlexTable具有這種功能，因爲它是爲動態內容設計的，意味着無論如何以編程方式添加它。

Answer 2

瞭解UiBinder Dev Guide是弄清楚如何清晰地構建UiBinder模板的關鍵。

因此，如果您只想創建一個小部件，並且最初不在DOM中，那麼請不要在UiBinder模板中提及它。相反，在與您的UiBinder模板配合使用的Java文件中，創建它並將其添加到模板中定義的面板中。

舉例來說，把這個在您的模板：

<g:HTMLPanel ui:field='container'>  
... 

，並把這個在您的Java文件：

@UiField HTMLPanel container; 
public MyWidget() { 
    initWidget(uiBinder.createAndBindUi(this)); 
    Label testLabel = new Label("hallo"); 
    // Do whatever you want to testLabel 
    container.add(testLabel); 
} 

Answer 3

我不能肯定，如果你有相同的不尋常的動力將更多的比uibinder標籤下的兩個根部件要多。無論如何，這是我如何做到的。

因爲uibinder標籤只允許一個根部件，所以我放置一個HTML ui標籤作爲根部件，然後在該標籤中堆積我的多個僞根部件。

在以下示例中，請注意實際的根小部件沒有ui：field name，因爲我們不打算使用它。就我們而言，有效的根部件是「tabLayout」和「內容」。

文件Hello.ui.xml：

<ui:UiBinder 
    xmlns:ui="urn:ui:com.google.gwt.uibinder" 
    xmlns:g="urn:import:com.google.gwt.user.client.ui"> 
    <g:HTML> 
    <g:TabLayoutPanel ui:field="tabLayout" ... > 
     blah ... blah 
    </g:TabLayoutPanel> 
    <g:VerticalPanel ui:field="content"> 
     blah .. blah 
    </g:VerticalPanel> 
    </g:HTML> 
</ui:UiBinder> 

不要延長複合材料作爲模板背後的Java代碼。 創建一個由模塊入口點導入的類，或者直接在模塊上使用該模板。

我有很多原因，爲什麼我需要一個以上的根部件。在本例中，我有條件地附加「有效根部件」：

public class Hello 
    implements EntryPoint{ 

    private static HelloUiBinder uiBinder = GWT.create(HelloUiBinder.class); 

    interface HelloUiBinder 
    extends UiBinder<Widget, Hello>{} 

    @UiField TabLayoutPanel tabLayout; 
    @UiField VerticalPanel content; 

    @Override public void onModuleLoad() { 
    uiBinder.createAndBindUi(this); 

    if (condition1) 
     RootPanel.get().add(tabLayout); 
    else 
     RootPanel.get().add(content); 

    blah ... blah 
    } 
} 

所以，訣竅是根本不使用實際的根部件。