2011-09-28 9 views
7

Korzystam z nowego projektu GWT 2.4 DataGrid w projekcie. Skonfigurowałem DataGrid na rozmiar strony 50.
Dostępny ekran nie jest wystarczająco duży, aby wyświetlić wszystkie elementy, a zatem wyświetlany jest pionowy pasek przewijania (w rzeczywistości jest to główny cel korzystania z DataGrid w pierwszej kolejności).
Do urządzenia DataGrid podłączyłem obiekt SingleSelectionModel, aby móc wybierać elementy.
To działa dobrze do tej pory.GWT 2.4 Automatyczne przewijanie DataGrid podczas wybierania elementu

Jednak mam też inny widżet, z którym użytkownik może wchodzić w interakcje. Na podstawie tej czynności użytkownika należy wybrać element z DataGrid.
Czasami wybrany element nie znajduje się w widocznym obszarze ekranu, a użytkownik musi przewinąć w dół w DataGrid, aby go zobaczyć.
Czy istnieje sposób automatycznego lub ręcznego przewijania w dół, aby wybrany element był widoczny?
Sprawdziłem JavaDocs DataGrid i nie znalazłem odpowiedniej metody lub funkcji do tego.

Odpowiedz

9

Nie wiem, czy to działa, ale można spróbować uzyskać element wiersza do wyboru i użyć metody scrollIntoView.

Przykład Kod:

dataGrid.getRowElement(INDEX_OF_SELECTED_ITEM).scrollIntoView(); 
+1

Dzięki za sugestię. To działa dobrze. Oto pełny kod: dataGrid.getRowElement (dataGrid.getVisibleItems(). IndexOf (MyObject)). ScrollIntoView(); –

2

Nie ma czasu na wypróbowanie, ale DataGrid implementuje interfejs HasRows, a HasRows ma między innymi metodę o nazwie setVisibleRange. Musisz tylko ustalić numer wiersza elementu, na którym chcesz się skupić, a następnie ustawić widoczny zakres od tej liczby n do n + 50. W ten sposób DataGrid zresetuje się, aby umieścić ten przedmiot na górze (lub w jego górnej części, jeśli znajduje się na ostatnich 50 elementach listy wspierających DataGrid). Nie zapomnij przerysować swojej DataGrid.

Czy już to sprawdziłeś? Jeśli tak, byłbym zaskoczony, że to nie zadziałało.

Aha, a ponieważ jest to jeden widget rozmawiający z innym, prawdopodobnie masz skonfigurowaną komunikację i niektóre programy do obsługi wiadomości, więc gdy użytkownik wejdzie w interakcję z drugim widżetem i "wybierze" element, wiadomość zostanie wywołana w EventBusie i program obsługi tego komunikatu naprawia DataGrid wzdłuż linii, które opisałem. Myślę, że będziesz musiał sam wykonać to okablowanie.

+0

Dzięki za sugestię. Wprowadziłem coś podobnego w innym CellTable, w którym obliczyłem wysokość CellTable, więc nie dostaję żadnych pasków przewijania. Jednak powodem, dla którego przełączyłem się na DataGrid była zdolność do przewijania. Oczywiście Twoja sugestia zadziała. Jednak chcę uniknąć ponownego rysowania początkowych informacji, które są pokazane, nie zmienia się poprzez wybranie pozycji. Interakcja odbywa się za pośrednictwem prezentera (korzystam z GWTP). Oba widżety są w widoku, a komunikacja działa dobrze. –

6

Odpowiedź powyżej działa całkiem dobrze, ale jeśli siatka jest szerszy niż okna i ma poziomy pasek przewijania, ale także przewija się przez całą drogę w prawo, co jest dość irytujące . Udało mi się go przewinąć w dół i pozostać przewijanym w lewo, pobierając pierwszą komórkę w wybranym wierszu, a następnie przewijając ją do widoku.

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

Moje rozwiązanie, trochę lepiej:

dataGrid.getRow(model).scrollIntoView(); 
0

Jak Kem wskazał, że to irytujące „scrollToRight” efekt po scrollIntoView.Po mnie, rozwiązanie Kema daje lepsze zachowanie niż podstawowe, ponieważ zwykle pierwsze kolumny w tabeli są bardziej znaczące. Ulepszyłem nieco jego podejście, które przewija się poziomo do pierwszej kolumny wiersza, który chcemy zobaczyć, obliczając pierwszą widoczną kolumnę po lewej przed zastosowaniem zwoju, a następnie przewijając do niego.

Ostatnia uwaga: Kolumny po lewej są testowane przeciwko "51". Jest to wartość, którą odkryłem "eksperymentalnie", szukając wartości JS w narzędziu programistycznym przeglądarki, myślę, że to zależy od stylu tabeli, może być konieczna zmiana/obliczenie.

poniższy kod:

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(); 
} 
Powiązane problemy