GWT 同一列中有不同的列类型？

Question

我正在开发一个 GWT 应用程序，到目前为止，我很喜欢 Java 开发人员友好的 UI 框架！

到目前为止，我已经能够使用这些小部件做几乎任何事情，但是这个让我难住了。我有一个单元格表，用作用户输入源。它只是用户输入键值对来调用我的服务的一种方式。用户可以动态添加行和删除行。

现在棘手的部分是我想强制用户输入某些键的值。这些键只有特定的 4-5 个可接受的值，因此对于这些行，我想将 editableTextCell 替换为 SelectionCell。考虑到列单元格类型声明是在将列添加到表中时完成的，不确定如何在表中混合单元格类型。

任何意见表示赞赏！

谢谢

Answer 1

您必须创建一个自定义单元格，有时会呈现 ，有时会呈现。如果您查看 EditableTextCell 和 SelectionCell 的代码，您可以了解如何实现这一目标。它可能非常简单 - 您可以编写其中的一个，然后在您的渲染函数中将数据传递到适当的单元格。

类似...

public class ChoosyCell extends AbstractCell<YourData> {
    SelectionCell selectCell = new SelectionCell<YourData>();
    EditableTextCell textCell = new EditableTextCell<YourData>();

    public void render(Context context, YourData data, SafeHtmlBuilder sb) {
        if (data.isTheLimitedType()) {
            selectCell.render(context, data, sb);
        } else {
            textCell.render(context,data, sb);
        }
     }
}

（未经测试的代码）

Answer 2

非常有用。这是我对条件渲染的 CheckboxCell 的看法

    import com.google.gwt.cell.client.AbstractCell;
    import com.google.gwt.cell.client.CheckboxCell;
    import com.google.gwt.cell.client.ValueUpdater;
    import com.google.gwt.dom.client.Element;
    import com.google.gwt.dom.client.EventTarget;
    import com.google.gwt.dom.client.NativeEvent;
    import com.google.gwt.safehtml.shared.SafeHtmlBuilder;

    /**
     * CheckboxCell that is conditionally rendered if the enclosing column's
     * Boolean com.google.gwt.user.cellview.client.Column.getValue(T object) method returns true.
     */
    public class ConditionallyRenderedCheckboxCell extends AbstractCell {

        public ConditionallyRenderedCheckboxCell() {
        //We handle the same events as CheckboxCell
        super("change", "keydown");
        }

        private CheckboxCell cell = null;

        @Override
        public void render(Context context, Boolean renderCheckboxCell, SafeHtmlBuilder sb) {
            if (renderCheckboxCell) {            
                this.cell = new CheckboxCell(false,true);  
                //Render the checkbox cell unchecked
                this.cell.render(context, false, sb);
            }
         }

        @Override
        public void onBrowserEvent(com.google.gwt.cell.client.Cell.Context context,
            Element parent, Boolean value, NativeEvent event,
            ValueUpdater valueUpdater) {

        //If we have created a checkbox cell, do event handling, otherwise, ignore it.
        if( this.cell != null ){
            super.onBrowserEvent(context, parent, value, event, valueUpdater);

            // Handle the change event.
            if ("change".equals(event.getType())) {

            // Ignore events that occur outside of the outermost element.
            EventTarget eventTarget = event.getEventTarget();

            if (parent.isOrHasChild(Element.as(eventTarget))) {

                // Use this to get the selected element!!
                Element el = Element.as(eventTarget);

                //Check if we really clicked on the checkbox
                if (el.getNodeName().equalsIgnoreCase("input") && el.getPropertyString("type").equalsIgnoreCase("checkbox")) {

                //If an value updater was defined, invoke it
                if(valueUpdater != null)
                    valueUpdater.update(el.getPropertyBoolean("checked"));          
                }
            }
            }
        }
        }        
    }

Answer 3

稍后回答，但无论如何。几天前，也面临着这个任务 - 必须在一列中使用文本或组合框进行单元格编辑。这是我的实现：

final GridInlineEditingTextOrCombo editing = new GridInlineEditingTextOrCombo(attributeTableGrid);
    editing.addEditor(valueCol);

自定义 GridInlineEditing 实现如下：

/**
 * Class intended to create GridInlineEditing functionality,
 * but with two type of editors in one column - TextField or SimpleComboBox,
 * depending of SnmpParameterDefDTO.getAllowedValues().
 */
class GridInlineEditingTextOrCombo extends GridInlineEditing<SnmpParameterDefDTO> {
    IsField<String> textField = new TextField();
    SimpleComboBox<String> simpleComboBox = new SimpleComboBox<String>(new StringLabelProvider<String>());
    Grid.GridCell currentCell = null;
    private boolean currentCellChanged = false;
    IsField<String> currentCellEditor;
    //ComboBox<String> comboBox = new ComboBox<String>();

    public GridInlineEditingTextOrCombo(Grid<SnmpParameterDefDTO> editableGrid) {
    super(editableGrid);
    simpleComboBox.setEditable(false);
    simpleComboBox.setAllowTextSelection(false);
    simpleComboBox.setTriggerAction(ComboBoxCell.TriggerAction.ALL);
    }

    @Override
    @SuppressWarnings("unchecked")
    public <O> IsField<O> getEditor(ColumnConfig<SnmpParameterDefDTO, ?> columnConfig) {
    IsField<O> field = super.getEditor(columnConfig);
    if(field!=null ){
        if(!currentCellChanged){
        return (IsField<O>)currentCellEditor;
        }else{
        currentCellChanged = false;
        SnmpParameterDefDTO param = this.editableGrid.getStore().get(this.currentCell.getRow());
        if(param.getAllowedValues() == null || param.getAllowedValues().size() == 0){
            currentCellEditor = (IsField<String>)field;
        }else{
            simpleComboBox.getStore().clear();
            simpleComboBox.add(param.getAllowedValues());
            currentCellEditor = simpleComboBox;
        }
        return (IsField<O>)currentCellEditor;
        }
    }
    return null;
    }

    @Override
    public <T> void addEditor(ColumnConfig<SnmpParameterDefDTO, T> columnConfig, IsField<T> field) {
    throw new RuntimeException("You can not call this method. Please use addEditor(ColumnConfig<SnmpParameterDefDTO, T> columnConfig) instead");
    }

    public <T> void addEditor(ColumnConfig<SnmpParameterDefDTO, T> columnConfig) {
    super.addEditor(columnConfig, (IsField<T>)textField);
    }

    @Override
    public void startEditing(Grid.GridCell cell){
    currentCell = cell;
    currentCellChanged = true;
    super.startEditing(cell);
    }

这是相当解决方法，不是优雅的实现，但无论如何，它工作得很好