GWT UiBinder multiple field in one template

Question

I have to create a div that totally changes form and size (but not content) based on the value of a variable. I would like do something like this:

<g:FlowPanel styleName="PanelA" ui:field="panelA">
    ...
    <g:HTML styleName="Html1" ui:field="html1"/>
    ...
    <g:HTML styleName="Html2" ui:field="html2"/>
    ...
</g:Flowpanel>
<g:FlowPanel styleName="PanelA" ui:field="panelB">
    ...
    <g:HTML styleName="Html1" ui:field="html1"/>
    ...
    <g:HTML styleName="Html2" ui:field="html2"/>
    ...
</g:Flowpanel>

but obviously the compiler give me the error:

Field html1 cannot appear multiple times in one template

There is a way to do what I want like that or I need to use css? Thanks a lot,

Willy

Answer 1

You can not have multiple fields with the same name.

I would declare all the variables but use only the proper ones, like this:

@UiField
HTML panelA_html1;
@UiField
HTML panelA_html2;
@UiField
HTML panelB_html1;
@UiField
HTML panelB_html2;

HTML html1;
HTML html2;

...

switch(panelLayout) {
    case A:
        html1 = panelA_html1;
        html2 = panelA_html2;
        break;
    case B:
        html1 = panelB_html1;
        html2 = panelB_html2;
        break;
}

Or just split your layout into set of separate smaller layouts and use the one you want at the time.

Answer 2

I found this:

https://makk.es/blog/gwt-uibinder-multiple-templates-one-owner-class/

I think that is the solution I was looking for!