title: How to use GWT UI Binders in "external" Package
body: <p>I'm working on a web app using GWT, and am in the process of modifying it to be built using UiBinders.</p>
  
  <p>I have a working version of several binders contained in the same package as the classes that reference them, but a lot of these have universal utility across the entire app, and I was hoping to factor them out into a uibinders package.</p>
  
  <p>Here are some snippets of the working code</p>
  
  <p>The TableListPanel.ui.xml file:</p>
  
  <pre><code>&lt;!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent"&gt;
  &lt;ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
  xmlns:g="urn:import:com.google.gwt.user.client.ui"&gt;
  &lt;g:HTMLPanel&gt;
  &lt;div id="tableListPanel"&gt;
      &lt;g:HTMLPanel styleName="buttonPanel" ui:field="buttonPanel"&gt;&lt;/g:HTMLPanel&gt;
      &lt;g:HTMLPanel styleName="tableList" ui:field="tableList"&gt;&lt;/g:HTMLPanel&gt;
      &lt;table align="center"&gt;&lt;tr&gt;
          &lt;td align="center"&gt;&lt;g:HTMLPanel styleName="tableMenu" ui:field="tableMenu"&gt;&lt;/g:HTMLPanel&gt;&lt;/td&gt;
      &lt;/tr&gt;&lt;/table&gt;
  &lt;/div&gt;
  &lt;/g:HTMLPanel&gt;
  
  &lt;/ui:UiBinder&gt; 
  </code></pre>
  
  <p>The TableListPanelBinder java file:</p>
  
  <pre><code>public class TableListPanelBinder extends Composite implements HasText {
  
  private static AuditPanelUiBinder uiBinder = GWT
          .create(AuditPanelUiBinder.class);
  
  interface AuditPanelUiBinder extends UiBinder&lt;Widget, TableListPanelBinder&gt; {
  }
  
  public TableListPanelBinder() {
      initWidget(uiBinder.createAndBindUi(this));
  }
  
  @UiField
  protected HTMLPanel buttonPanel;
  
  @UiField
  protected HTMLPanel tableList;
  
  @UiField
  protected HTMLPanel tableMenu;
  
  public void bindUiElement(HTMLPanel container, Widget widjetObj) {
      container.add(widjetObj);
  }
  </code></pre>
  
  <p>And finally the call in the code that binds widgets to the above ui:fields :</p>
  
  <pre><code>public AuditReportProfilesPanel() {
      super();
      this.setWidth("100%");
      this.setSpacing(4);
  
  
      this.parmSetsTable = createParmSetsTable();
      SimplePager.Resources pagerResources = GWT.create(SimplePager.Resources.class);
      pager = new SimplePager(TextLocation.CENTER, pagerResources, false, 0, true);
      pager.setDisplay(parmSetsTable);
  
      TableListPanelBinder reportListBinder = new TableListPanelBinder();
      this.add(reportListBinder);
  
      // -START- Bind UI Elements -START-
      reportListBinder.bindUiElement(reportListBinder.tableList, parmSetsTable);
      reportListBinder.bindUiElement(reportListBinder.tableMenu, pager);
      reportListBinder.bindUiElement(reportListBinder.buttonPanel, createActionBar());
      //-END- Bind UI Elements -END-
  }
  </code></pre>
  
  <p>I know this is probably not the cleanest way to set this up, but I'm learning as I go.</p>
  
  <p>I know moving the Binder to a different package means that the private/protected access modifiers will prevent me from reaching the code, but changing them to public doesn't do me any good either.</p>
  
  <p>Any suggestions to a fix would be much appreciated. This app has several different class packages (That essentially equate to different pages in the app), and they all use a similar table setup, so I would like to avoid having duplicate code in every package; I'm just not 100% sure on the best way to achieve that.</p>
  
  <p>Would creating Abstract classes in the Binders package and then extending them in the individual app packages solve the problem, or is there something I'm missing?</p>