用UiBinder定义GWT CellTables [英] Defining GWT CellTables with UiBinder

问题描述

 < ui：UiBinder xmlns：如果我在MyView.ui.xml UiBinder文件中定义了我的CellTable， 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> 
  

然后programmaticaly将列添加到CellTable，一切正常。

但是为了减少样板代码，我想在UiBinder文件中定义表格列。我试过这个：

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

但它会产生以下错误：

[ERROR] [dialective] - 找到意外的子元素元素addStyleNames ='{style.titleColumn}'ui：field ='titleColumn'>（：33）

如何使用UiBinder定义整个CellTable？

解决方案

，在第二个列表中，你试图添加一个列作为子对象。 Cell table不直接接受孩子（这意味着没有addChild（...）方法）。

如果你有固定数量的列并且想要使用UIBinder，可以考虑仅使用HTML表格。在这种情况下，您将拥有XML文件中的所有列，但表格将变得更难以使用 - HtmlElement不是Widget。

 < table ui：field =table> 
< col ui：field =firstColumnclass ={style.firstColumn}> 
< col ui：field =secondColumnclass ={style.secondColumn}> 
 ... 
< / table> 
  

代码可能如下所示：

  ... 
 @UiField 
 Private TableColElement firstColumn; 
 
 @UiField 
私人TableColElement secondColumn; 
  

但是对表格的所有其他操作将通过DOM进行。像table.appentChild（rowElement）一样。我认为这样做不值得。

If I define my CellTable in MyView.ui.xml UiBinder file like this:

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

and then programmaticaly add the columns to the CellTable, everything works fine.

But in an attempt to reduce boilerplate code I would like to define also the table columns in my UiBinder file. I've tried this:

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

But it produces the following error:

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

How could I define the whole CellTable using UiBinder?

解决方案

Evidently, in the second listing you're trying to add a column as a child object. Cell table doesn't accept children directly (meaning there is no addChild(...) method).

If you have fixed number of columns and want to use UIBinder consider using mere HTML table. In that case you will have all columns in the XML file, but the table will become harder to work with - HtmlElement not Widget.

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

And the code might look like the following

... 
@UiField
private TableColElement firstColumn;

@UiField
private TableColElement secondColumn;

But all other operations with the table will be via DOM. Like table.appentChild(rowElement). I think doing like this doesn't worth it.

这篇关于用UiBinder定义GWT CellTables的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！