java - que - css grid layout example

¿Hay alguna manera de establecer una celda en la cuadrícula en modo de edición con la cuadrícula Vaadin 8

Question

He definido una cuadrícula como esta usando Vaadin 8:

 ListDataProvider<Value> gridDataProvider =
new ListDataProvider<>(new ArrayList<>());
GridSelectionModel<Value> selectionModel;
Grid<Value> grid = new Grid<>(Value.class);
TextField editorField = new TextField();
editorField.setSizeFull();
Binder<Value> binder = new Binder<>();
binder.bind(editorField, Value::getValue, Value::setValue);
Editor<Value> gridEditor = grid.getEditor();
gridEditor.setBinder(binder);
gridEditor.addSaveListener((EditorSaveListener<Value>) event -> {
gridDataProvider.refreshAll();
});
gridEditor.setEnabled(true);
grid.addColumn(Value::getValue).setEditorComponent(editorField, Value::setValue);
grid.removeHeaderRow(0);
selectionModel = grid.setSelectionMode(Grid.SelectionMode.MULTI);
grid.setDataProvider(gridDataProvider);
grid.setSizeFull();

El bean Value es solo un bean regular

 private class Value {
private String value;
Value(String value) {
this.value = value;
}
String getValue() {
return value;
}
void setValue(String value) {
this.value = value;
}
@Override public boolean equals(Object o) {
if (this == o)
return true;
if (o == null || getClass() != o.getClass())
return false;
Value value1 = (Value) o;
return Objects.equals(value, value1.value);
}

Lo que quiero hacer es agregar el botón, de modo que al hacer clic en ese botón se debe agregar una nueva fila a la cuadrícula y la única columna en la nueva fila debe configurarse en modo de edición para que el usuario pueda escribir un nuevo valor directamente. ¿Es posible hacer esto?

Answer 1

El editor de apertura programáticamente no es posible con las API actuales de Vaadin 8. Hay 2 problemas para agregar esta función actualmente abierta:

https://github.com/vaadin/framework/issues/8477
https://github.com/vaadin/framework/issues/8820

Puede ser una buena idea no usar Value.value en el método equals porque esto causará problemas con algunas características de Grid, como grid.select (T item).

Este fragmento de código permitirá al usuario usar la flecha e ingresar las teclas para editar el último elemento.

private void onButtonClick(Button.ClickEvent clickEvent) {
Value newValue = new Value("New value");
list.add(newValue);
grid.getDataProvider().refreshAll();
grid.focus();
}

Grid no recibirá el enfoque automáticamente después de que el editor esté oculto. Necesitas ayudar a Vaadin un poco:

gridEditor.addSaveListener((EditorSaveListener<Value>) event -> {
gridDataProvider.refreshAll();
grid.focus();
});