GWT EditTextCell:如何在EditTextCell中增加可编辑文本框的宽度?

GWT EditTextCell:如何在EditTextCell中增加可编辑文本框的宽度?,gwt,cell,gwt-2.2-celltable,gwt-celltable,Gwt,Cell,Gwt 2.2 Celltable,Gwt Celltable,我正在我的项目中使用GWT2.3。 我想在用户单击editableTextCell时增加editableTextBox的宽度。 问题是我的列宽是200像素。当用户单击editableTextCell时,editableTextCell中的文本框宽度约为125px,比列宽小 我在Celltable的列中添加了EditTextCell Column stringColumn=新列(新的EditTextCell()){ //我的代码 } addColumn(stringColumn,“MyColumn

我正在我的项目中使用GWT2.3。 我想在用户单击editableTextCell时增加editableTextBox的宽度。 问题是我的列宽是200像素。当用户单击editableTextCell时,editableTextCell中的文本框宽度约为125px,比列宽小

我在Celltable的列中添加了EditTextCell

Column stringColumn=新列(新的EditTextCell()){ //我的代码 }

addColumn(stringColumn,“MyColumn”); cellTable.setColumnWidth(checkBoxColumn,200,单位为PX)

我尝试了下面的方法来增加文本框的宽度,但问题是我不能在文本框+焦点而不是丢失中编辑

    @Override
            public void onBrowserEvent(Context context, Element elem,Record object, NativeEvent event) {
                String type = event.getType();

                  int editedTexBoxSize = (cellTable.getOffsetWidth()-100)/cellTable.getColumnCount();

                  if(elem.getInnerHTML().startsWith("<INPUT")){
                      String test = elem.getInnerHTML();
                     // test = <INPUT tabIndex=-1 value=P __eventBits="2048"></INPUT>

                     test= test.replace("value", " size="+editedTexBoxSize+" value");


                    // test = <INPUT tabIndex=-1 size=131 value=P __eventBits="2048"></INPUT>


                      elem.setInnerHTML(test);
                  }
                super.onBrowserEvent(context, elem, object, event);
            }
@覆盖
public void onBrowserEvent(上下文上下文、元素元素、记录对象、NativeEvent事件){
字符串类型=event.getType();
int editedTexBoxSize=(cellTable.getOffsetWidth()-100)/cellTable.getColumnCount();

如果(elem.getInnerHTML().startsWith(“),则需要创建自定义组件。开箱即用的EditTextCell不允许您设置输入字段的大小属性,只允许设置列宽

在这里看一下ValidateableInputCell impl:一个如何创建自定义单元格的示例


诚然,验证还不起作用,但在单元格内设置输入字段大小的功能起作用。

在我的项目中,我这样做:

cellTable.getColumn(cellTable.getColumnIndex(column)).setCellStyleNames(CELL_CSS);

.edit-cell input {
    width: 290px;
}
终于找到答案了! 我使用UIBinder尝试了更简单的方法,添加了:

.edit-cell input {
    width: 30px;
    text-align: right;
}
然后我添加了单元格表

 <c:CellTable
        addStyleNames='{style.edit-cell}'
        ui:field='itemTable' />

太好了