gwt datagrid vertical-scrolling

GWT 2.4 DataGrid de desplazamiento automático al seleccionar un elemento



vertical-scrolling (6)

Como Kem señaló, es molesto el efecto "scrollToRight" después del scrollIntoView. Después de mí, la solución de Kem ofrece un mejor comportamiento que la base, ya que normalmente las primeras columnas de una tabla son más significativas. Mejoré un poco su enfoque, que se desplaza horizontalmente a la primera columna de la fila que queremos que sea visible, al calcular la primera columna visible a la izquierda antes de aplicar el desplazamiento y luego desplazarnos hacia él.

Una nota final: Columnas absolutas a la izquierda se prueban contra "51". Este es un valor que encontré "experimentalmente" al buscar los valores de JS en la herramienta de desarrollo del navegador, creo que depende del estilo de la tabla, puede que necesite cambiarla / calcularla.

Debajo del código:

public void scrollIntoView(T next) { int index = datagrid.getVisibleItems().indexOf(next); NodeList<TableCellElement> cells = datagrid.getRowElement(index).getCells(); int firstVisibleIndex = -1; for(int i=0; i<cells.getLength() && firstVisibleIndex<0;i++) if(UIObject.isVisible(cells.getItem(i)) && (cells.getItem(i).getAbsoluteLeft() > 51) && (cells.getItem(i).getAbsoluteTop() > 0)) firstVisibleIndex = i; cells.getItem(firstVisibleIndex>=0? firstVisibleIndex : 0).scrollIntoView(); }

Estoy usando el nuevo DataGrid de GWT 2.4 en un proyecto. Configuré DataGrid con un tamaño de página de 50.
La pantalla disponible no es lo suficientemente grande como para mostrar todos los elementos y, por lo tanto, se muestra una barra de desplazamiento vertical (este es en realidad el objetivo principal para usar un DataGrid en primer lugar).
Adjunté SingleSelectionModel a DataGrid para poder seleccionar elementos.
Esto funciona bien hasta ahora.

Sin embargo, también tengo otro widget con el que el usuario puede interactuar. En función de esa acción del usuario, se debe seleccionar un elemento de DataGrid .
A veces, el elemento seleccionado no se encuentra en la región de la pantalla visible y el usuario tiene que desplazarse hacia abajo en DataGrid para verlo.
¿Hay alguna manera de desplazarse hacia abajo automáticamente o manualmente, de modo que el elemento seleccionado sea visible?
Revisé los JavaDocs de DataGrid y no encontré ningún método o función apropiada para hacer eso.

No sé si esto funciona, pero podría tratar de obtener el elemento de fila para la selección y usar el método scrollIntoView.

Código de ejemplo:

dataGrid.getRowElement(INDEX_OF_SELECTED_ITEM).scrollIntoView();

No tiene tiempo para probarlo, pero DataGrid implementa la interfaz HasRows, y HasRows tiene, entre otras cosas, un método llamado setVisibleRange. Solo necesita averiguar el número de fila del artículo en el que desea enfocar, y luego establecer el rango visible desde ese número n hasta n + 50. De esta forma, DataGrid se restablecerá para colocar ese elemento en la parte superior (o cerca de la parte superior si está en los últimos 50 elementos de la lista que respalda el DataGrid). No olvides volver a dibujar tu DataGrid.

¿Ya has mirado esto? Si es así, me sorprendería que no funcionara.

Ah, y dado que este es un widget que habla con otro, probablemente tenga algunos mensajes configurados y algunos manejadores de mensajes para que cuando el usuario interactúe con ese segundo widget y "seleccione" el elemento, el mensaje se active en el EventBus y en un controlador para ese mensaje corrige el DataGrid a lo largo de las líneas que he descrito. Creo que tendrás que hacer este cableado tú mismo.

La respuesta anterior funciona bastante bien, aunque si la cuadrícula es más ancha que la ventana y tiene una barra de desplazamiento horizontal, también se desplaza completamente hacia la derecha, lo que es bastante molesto. Pude hacer que se desplazara hacia abajo y quedara desplazado hacia la izquierda al obtener la primera celda de la fila seleccionada y luego hacer que se deslizara hacia la vista.

dataGrid.getRowElement(dataGrid.getVisibleItems().indexOf(object)).getCells().getItem(0).scrollIntoView();

Mi solución, un poco mejor:

dataGrid.getRow(model).scrollIntoView();