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

Question

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

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

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

任何输入赞赏！

感谢

Answer 1

你必须创建一个自定义单元格，有时呈现一个<select>有时呈现的<input>。如果您查看EditableTextCell和SelectionCell的代码，您可以了解如何实现这一点。它可能非常简单 - 你可以编写其中的一个，并在你的render函数中将数据传递给适当的单元格。

喜欢的东西...

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); 
    } 

这是相当的解决方法，而不是优雅的实现，但无论如何，它工作正常