CellTables Definizione GWT con UiBinder

Question

se definisco la mia CellTable in MyView.ui.xml UiBinder file in questo modo:

<ui:UiBinder xmlns:ui='urn:ui:com.google.gwt.uibinder' 
xmlns:g='urn:import:com.google.gwt.user.client.ui' 
xmlns:c="urn:import:com.google.gwt.user.cellview.client" 
ui:generateFormat='com.google.gwt.i18n.rebind.format.PropertiesFormat' 
ui:generateKeys='com.google.gwt.i18n.rebind.keygen.MD5KeyGenerator' 
ui:generateLocales='default' xmlns:p1="urn:import:com.google.gwt.user.cellview.client"> 
     ... 
    <g:HTMLPanel>   
     <c:CellTable 
     addStyleNames='{style.cellTable}' 
     pageSize='15' 
     ui:field='cellTable' width="100%"> 
     </c:CellTable>   
    </g:HTMLPanel> 

e poi programmaticaly aggiungere le colonne alla CellTable, tutto funziona bene.

Ma nel tentativo di ridurre il codice di codice, vorrei definire anche le colonne della tabella nel mio file UiBinder. Ho provato questo:

... 
    <g:HTMLPanel>   
     <c:CellTable 
     addStyleNames='{style.cellTable}' 
     pageSize='15' 
     ui:field='cellTable' width="100%"> 
      <c:TextColumn 
       addStyleNames='{style.titleColumn}' 
       ui:field="titleColumn"/> 
     </c:CellTable>   
    </g:HTMLPanel> 

ma produce il seguente errore:

[ERROR] [dialective] - Found unexpected child element Element addStyleNames='{style.titleColumn}'ui:field='titleColumn'> (:33)

Come potrei definire l'intero CellTable utilizzando UiBinder?

Answer 1

Evidentemente, nel secondo elenco si sta tentando di aggiungere una colonna come oggetto figlio. La tabella delle celle non accetta direttamente i bambini (il che significa che non esiste alcun metodo addChild (...)).

Se è stato risolto un numero di colonne e si desidera utilizzare UIBinder, è consigliabile utilizzare una semplice tabella HTML. In questo caso avrai tutte le colonne nel file XML, ma la tabella diventerà più difficile con cui lavorare - HtmlElement not Widget.

<table ui:field="table"> 
    <col ui:field="firstColumn" class="{style.firstColumn}"> 
    <col ui:field="secondColumn" class="{style.secondColumn}"> 
    ... 
</table> 

E il codice potrebbe essere simile alla seguente

... 
@UiField 
private TableColElement firstColumn; 

@UiField 
private TableColElement secondColumn; 

Ma tutte le altre operazioni con il tavolo saranno via DOM. Come table.appentChild (rowElement). Penso che fare così non ne valga la pena.