EditTextCell FieldUpdater宽度

Question

如何在字段编辑时设置文本框的宽度？

EditTextCell febCell = new EditTextCell();
Column<DTO, String> febColumn = new Column<DTO, String>(febCell){
    @Override
    public String getValue(DTO object) {
        return (String.valueOf(object.getFeb()));
    }
};
febColumn.setFieldUpdater(new FieldUpdater<DTO, String>() {
    public void update(int index, DTO object, String value) {
        System.out.println("index="+index+" resourceId="+object.getId()+" feb="+value);
    }
});
febColumn.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_LOCALE_END);
cellTable.addColumn(febColumn, "Feb");
cellTable.setColumnWidth(febColumn, 3, Unit.PCT);

一切都运行良好,但是当我点击可编辑字段时,会出现一个非常大的文本框.那么,如何自定义此小部件以编辑数据？

如果我在PX中设置宽度而不是像PCT那样

cellTable.setColumnWidth(febColumn, 25, Unit.PX);

编辑时单元格不会爆炸,但内部文本框仍然具有相同的长宽度,并且长字符串值隐藏在右侧后面.

好.可能我需要为每种类型的EditTextCell重新发明轮子:

MyEditTextCell extends AbstractEditableCell<String, MyEditTextCell.ViewData> ...
interface MyTemplate extends SafeHtmlTemplates {
    @Template("<input type=\"text\" value=\"{0}\" tabindex=\"-1\" size=\"{1}\" maxlength=\"{1}\" style=\"{2}\"></input>")
    SafeHtml input(String value, Integer maxLength, String style);
}
...
@Override public void render(com.google.gwt.cell.client.Cell.Context context,
                             String value, SafeHtmlBuilder sb) {...

sb.append(template.input(text, maxLegth, style));

并使用这样的小部件:

MyEditTextCell febCell = new MyEditTextCell(SimpleSafeHtmlRenderer.getInstance(), 4, "width:35px;");

欢迎任何想法.

Answer 1

你走在正确的轨道上。使用文本区域元素而不是输入 type="text"。我从 EditTextCell 的源开始，并在适当的位置插入了 textarea 元素而不是输入。请参阅下面的代码

public class TextAreaEditCell extends
    AbstractEditableCell<String, TextAreaEditCell.ViewData> {

interface Template extends SafeHtmlTemplates {
    @Template("<textarea tabindex=\"-1\" rows=\"{1}\" cols=\"{2}\" >{0}</textarea>")
    SafeHtml input(String value, Integer rows, Integer cols);
}
... 
private int rows, cols;

/**
 * Construct a new EditTextCell that will use a
 * {@link SimpleSafeHtmlRenderer}.
 */
public TextAreaEditCell() {
    this(SimpleSafeHtmlRenderer.getInstance(), 1, 20);
}

/**
 * Construct a new EditTextCell that will use a given
 * {@link SafeHtmlRenderer} to render the value when not in edit mode.
 * 
 * @param renderer
 *            a {@link SafeHtmlRenderer SafeHtmlRenderer<String>} instance
 */
public TextAreaEditCell(SafeHtmlRenderer<String> renderer, int r, int c) {
    super("click", "keyup", "keydown", "blur");
    rows = r;
    cols = c;
...
} else if ("blur".equals(type)) {
        // Commit the change. Ensure that we are blurring the input element
        // and
        // not the parent element itself.
        EventTarget eventTarget = event.getEventTarget();
        if (Element.is(eventTarget)) {
            Element target = Element.as(eventTarget);
            if ("textarea".equals(target.getTagName().toLowerCase())) {
...
/**
 * Get the input element in edit mode.
 */
private TextAreaElement getInputElement(Element parent) {
    return parent.getFirstChild().<TextAreaElement> cast();
}
...
    private String updateViewData(Element parent, ViewData viewData,
        boolean isEditing) {
    TextAreaElement input = (TextAreaElement) parent.getFirstChild();
    // InputElement input = (InputElement) parent.getFirstChild();
...