CellTables Definición de GWT con UiBinder

Question

Si me definen mi CellTable en MyView.ui.xml UiBinder archivo de la siguiente manera:

<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> 

y luego programmaticaly añadir las columnas a la CellTable, todo funciona bien.

Pero en un intento por reducir el código repetitivo, me gustaría definir también las columnas de la tabla en mi archivo UiBinder. He intentado esto:

... 
    <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> 

pero produce el siguiente error:

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

¿Cómo podría definir todo el CellTable usando UiBinder?

Answer 1

Evidentemente, en el segundo listado está tratando de agregar una columna como un objeto secundario. La tabla Cell no acepta hijos directamente (lo que significa que no hay un método addChild (...)).

Si ha arreglado el número de columnas y desea utilizar UIBinder, considere usar mera tabla HTML. En ese caso, tendrá todas las columnas en el archivo XML, pero será más difícil trabajar con la tabla: HtmlElement not Widget.

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

Y el código podría tener el siguiente

... 
@UiField 
private TableColElement firstColumn; 

@UiField 
private TableColElement secondColumn; 

Pero todas las demás operaciones con la mesa serán a través de DOM. Como table.appentChild (rowElement). Creo que hacer esto no vale la pena.