Adding items to custom widget in GWT UiBinder

Question

I created a custom form dropdown widget in GWT. Basically it is a list box with some bells and whistles attached to it. I would like to add items to the list box using the UiBinder. If it was just a gwt ListBox I could have

<g:ListBox>
  <g:item>Test</g:item>
  <g:item>Test</g:item>
</g:ListBox>

and all is good. In the same spirit I would like my custom widget to also aceppt adding items like:

<my:FormDropdown>
  <g:item>Test</g:item>
  <g:item>Test</g:item>
</my:FormDropdown>

I don't need it to be g:item that I add to it incase I need to make a custom thing. I think I need to use GWT UiBinder factory methods, but I can't find a location in the GWT UiBinder docs that discusses this.

Churro Churro · Accepted Answer · 2014-03-21T21:57:55

Add a namespace declaration to your <ui:Binder .... > tag at the top of the UIBinder XML like this:

xmlns:my="urn:import:com.yourcompany.yourproject.widgets"

You are adding an XML namespace, that points to the package containing FormDropdown.java.

So if your FormDropdown is in: com.yourcompany.yourproject.widgets.FormDropdown.java

Then your UI Binder XML should say:

<!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" 
    xmlns:my="urn:import:com.yourcompany.yourproject.widgets">
    <ui:style>
    .important {
        font-weight: bold;
    }
    </ui:style>
    <g:HTMLPanel>

        <my:FormDropdown>
            <g:item>Test</g:item>
            <g:item>Test</g:item>
        </my:FormDropdown>

    </g:HTMLPanel>
</ui:UiBinder>

Adding items to custom widget in GWT UiBinder

1 Answers