EditTextCell FieldUpdater宽度
如何在字段编辑时设置文本框的宽度？
EditTextCell febCell = new EditTextCell(); Column febColumn = new Column(febCell){ @Override public String getValue(DTO object) { return (String.valueOf(object.getFeb())); } }; febColumn.setFieldUpdater(new FieldUpdater() { 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 ... interface MyTemplate extends SafeHtmlTemplates { @Template("") 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;");
欢迎任何想法。
重新实现的解决方案。 请注意setInputWidth方法。
public class JustInPlaceEditCell extends AbstractEditableCell { interface Template extends SafeHtmlTemplates { @Template("") SafeHtml input(String value, int size); } /** * The view data object used by this cell. We need to store both the text and * the state because this cell is rendered differently in edit mode. If we did * not store the edit state, refreshing the cell with view data would always * put us in to edit state, rendering a text box instead of the new text * string. */ static class ViewData { private boolean isEditing; /** * If true, this is not the first edit. */ private boolean isEditingAgain; /** * Keep track of the original value at the start of the edit, which might be * the edited value from the previous edit and NOT the actual value. */ private String original; private String text; /** * Construct a new ViewData in editing mode. * * @param text the text to edit */ public ViewData(String text) { this.original = text; this.text = text; this.isEditing = true; this.isEditingAgain = false; } @Override public boolean equals(Object o) { if (o == null) { return false; } ViewData vd = (ViewData) o; return equalsOrBothNull(original, vd.original) && equalsOrBothNull(text, vd.text) && isEditing == vd.isEditing && isEditingAgain == vd.isEditingAgain; } public String getOriginal() { return original; } public String getText() { return text; } @Override public int hashCode() { return original.hashCode() + text.hashCode() + Boolean.valueOf(isEditing).hashCode() * 29 + Boolean.valueOf(isEditingAgain).hashCode(); } public boolean isEditing() { return isEditing; } public boolean isEditingAgain() { return isEditingAgain; } public void setEditing(boolean isEditing) { boolean wasEditing = this.isEditing; this.isEditing = isEditing; // This is a subsequent edit, so start from where we left off. if (!wasEditing && isEditing) { isEditingAgain = true; original = text; } } public void setText(String text) { this.text = text; } private boolean equalsOrBothNull(Object o1, Object o2) { return (o1 == null) ? o2 == null : o1.equals(o2); } } private static Template template; private int inputWidth = 20; public int getInputWidth() { return inputWidth; } public void setInputWidth(int inputWidth) { this.inputWidth = inputWidth; } private final SafeHtmlRenderer renderer; /** * Construct a new EditTextCell that will use a * {@link com.google.gwt.text.shared.SimpleSafeHtmlRenderer}. */ public JustInPlaceEditCell() { this(SimpleSafeHtmlRenderer.getInstance()); } /** * Construct a new EditTextCell that will use a given {@link SafeHtmlRenderer}. * * @param renderer a {@link SafeHtmlRenderer SafeHtmlRenderer } instance */ public JustInPlaceEditCell(SafeHtmlRenderer renderer) { super("click", "keyup", "keydown", "blur"); if (template == null) { template = GWT.create(Template.class); } if (renderer == null) { throw new IllegalArgumentException("renderer == null"); } this.renderer = renderer; } @Override public boolean isEditing(Context context, Element parent, String value) { ViewData viewData = getViewData(context.getKey()); return viewData == null ? false : viewData.isEditing(); } @Override public void onBrowserEvent(Context context, Element parent, String value, NativeEvent event, ValueUpdater valueUpdater) { Object key = context.getKey(); ViewData viewData = getViewData(key); if (viewData != null && viewData.isEditing()) { // Handle the edit event. editEvent(context, parent, value, viewData, event, valueUpdater); } else { String type = event.getType(); int keyCode = event.getKeyCode(); boolean enterPressed = "keyup".equals(type) && keyCode == KeyCodes.KEY_ENTER; if ("click".equals(type) || enterPressed) { // Go into edit mode. if (viewData == null) { viewData = new ViewData(value); setViewData(key, viewData); } else { viewData.setEditing(true); } edit(context, parent, value); } } } @Override public void render(Context context, String value, SafeHtmlBuilder sb) { // Get the view data. Object key = context.getKey(); ViewData viewData = getViewData(key); if (viewData != null && !viewData.isEditing() && value != null && value.equals(viewData.getText())) { clearViewData(key); viewData = null; } if (viewData != null) { String text = viewData.getText(); SafeHtml html = renderer.render(text); if (viewData.isEditing()) { // Note the template will not treat SafeHtml specially sb.append(template.input(html.asString(), inputWidth)); } else { // The user pressed enter, but view data still exists. sb.append(html); } } else if (value != null) { SafeHtml html = renderer.render(value); sb.append(html); } } @Override public boolean resetFocus(Context context, Element parent, String value) { if (isEditing(context, parent, value)) { getInputElement(parent).focus(); return true; } return false; } /** * Convert the cell to edit mode. * * @param context the {@link Context} of the cell * @param parent the parent element * @param value the current value */ protected void edit(Context context, Element parent, String value) { setValue(context, parent, value); InputElement input = getInputElement(parent); input.focus(); input.select(); } /** * Convert the cell to non-edit mode. * * @param context the context of the cell * @param parent the parent Element * @param value the value associated with the cell */ private void cancel(Context context, Element parent, String value) { clearInput(getInputElement(parent)); setValue(context, parent, value); } /** * Clear selected from the input element. Both Firefox and IE fire spurious * onblur events after the input is removed from the DOM if selection is not * cleared. * * @param input the input element */ private native void clearInput(Element input) /*-{ if (input.selectionEnd) input.selectionEnd = input.selectionStart; else if ($doc.selection) $doc.selection.clear(); }-*/; /** * Commit the current value. * * @param context the context of the cell * @param parent the parent Element * @param viewData the {@link ViewData} object * @param valueUpdater the {@link ValueUpdater} */ private void commit(Context context, Element parent, ViewData viewData, ValueUpdater valueUpdater) { String value = updateViewData(parent, viewData, false); clearInput(getInputElement(parent)); setValue(context, parent, viewData.getOriginal()); if (valueUpdater != null) { valueUpdater.update(value); } } private void editEvent(Context context, Element parent, String value, ViewData viewData, NativeEvent event, ValueUpdater valueUpdater) { String type = event.getType(); boolean keyUp = "keyup".equals(type); boolean keyDown = "keydown".equals(type); if (keyUp || keyDown) { int keyCode = event.getKeyCode(); if (keyUp && keyCode == KeyCodes.KEY_ENTER) { // Commit the change. commit(context, parent, viewData, valueUpdater); } else if (keyUp && keyCode == KeyCodes.KEY_ESCAPE) { // Cancel edit mode. String originalText = viewData.getOriginal(); if (viewData.isEditingAgain()) { viewData.setText(originalText); viewData.setEditing(false); } else { setViewData(context.getKey(), null); } cancel(context, parent, value); } else { // Update the text in the view data on each key. updateViewData(parent, viewData, true); } } 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 ("input".equals(target.getTagName().toLowerCase())) { commit(context, parent, viewData, valueUpdater); } } } } /** * Get the input element in edit mode. */ private InputElement getInputElement(Element parent) { return parent.getFirstChild().cast(); } /** * Update the view data based on the current value. * * @param parent the parent element * @param viewData the {@link ViewData} object to update * @param isEditing true if in edit mode * @return the new value */ private String updateViewData(Element parent, ViewData viewData, boolean isEditing) { InputElement input = (InputElement) parent.getFirstChild(); String value = input.getValue(); viewData.setText(value); viewData.setEditing(isEditing); return value; } }
你走在正确的轨道上。 使用文本区域元素而不是input type =“text”。 我开始使用EditTextCell的源代码并在适当的位置插入textarea元素而不是输入。 请参阅下面的代码
public class TextAreaEditCell extends AbstractEditableCell { interface Template extends SafeHtmlTemplates { @Template("") 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} instance */ public TextAreaEditCell(SafeHtmlRenderer 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(). cast(); } ... private String updateViewData(Element parent, ViewData viewData, boolean isEditing) { TextAreaElement input = (TextAreaElement) parent.getFirstChild(); // InputElement input = (InputElement) parent.getFirstChild(); ...