本文介绍如何在 GWT 的 CellTable 中，通过自定义 EditTextCell 实现支持滚动、换行的多行文本输入功能，无需更改表格类型，兼容现有 Cell 架构。

本文介绍如何在 gwt 的 `celltable` 中，通过自定义 `edittextcell` 实现支持滚动、换行的多行文本输入功能，无需更改表格类型，兼容现有 `cell` 架构。

在 GWT 中，TextInputCell 仅支持单行文本输入，无法自动换行或滚动；而标准 CellTable 要求列必须使用 Cell 类型，因此不能直接替换为 TextArea 等 Widget。解决该问题的核心思路是：继承 EditTextCell 并重写其渲染逻辑，使用 替代默认的 <input type="text">，同时通过 CSS 控制尺寸与滚动行为。

以下是一个轻量、可复用的 ScrollableTextAreaCell 实现：

public class ScrollableTextAreaCell extends EditTextCell {
  interface ScrollableTextAreaTemplate extends SafeHtmlTemplates {
    @Template("<textarea tabindex='\"-1\"' style='\"width:100%;' height:60px resize:none overflow-y:auto rows='\"3\"' cols='\"20\"'></textarea>")
    SafeHtml render(SafeHtml value);

    @Template("<textarea tabindex='\"-1\"' style='\"width:100%;' height:60px resize:none overflow-y:auto rows='\"3\"' cols='\"20\"' disabled></textarea>")
    SafeHtml renderReadOnly(SafeHtml value);
  }

  private static ScrollableTextAreaTemplate template = 
      GWT.create(ScrollableTextAreaTemplate.class);

  public ScrollableTextAreaCell() {
    super(new TextCell());
  }

  @Override
  public void render(Context context, String value, SafeHtmlBuilder sb) {
    if (value == null) {
      value = "";
    }
    sb.append(template.render(SafeHtmlUtils.fromSafeConstant(value)));
  }

  @Override
  public void render(Context context, String value, SafeHtmlBuilder sb, boolean isEditing) {
    if (isEditing) {
      sb.append(template.render(SafeHtmlUtils.fromSafeConstant(value)));
    } else {
      sb.append(template.renderReadOnly(SafeHtmlUtils.fromSafeConstant(value)));
    }
  }
}

使用方式（替换原 TextInputCell）：

private final Column<thing string> nameColumn;

// ✅ 使用自定义可滚动文本单元格
nameColumn = new Column<thing string>(new ScrollableTextAreaCell()) {
  @Override
  public String getValue(Thing object) {
    return object.getName();
  }
};
samplesTable.addColumn(nameColumn, SafeHtmlUtils.fromSafeConstant("Name"));</thing></thing>

⚠️ 注意事项：

• ScrollableTextAreaCell 依赖 SafeHtmlTemplates，需确保 GWT 编译器能识别模板接口（接口名须以 Template 结尾，方法返回 SafeHtml）；
• height 和 rows/cols 可根据实际列宽动态调整，建议配合 CSS 类统一管理样式；
• 若需支持实时编辑（如双击即进入编辑态），请确认 CellTable 已启用编辑模式：samplesTable.setKeyboardSelectionPolicy(KeyboardSelectionPolicy.ENABLED)；
• resize:none 防止用户拖拽缩放，overflow-y:auto 保证内容超长时出现垂直滚动条。

该方案完全遵循 GWT 的 Cell 设计范式，不引入 Widget 开销，保持高性能渲染，是 CellTable 场景下实现多行可滚动文本编辑的最佳实践。