DataGrid

CellTableでは大きな行数のデータを表示しようとすると様々な不都合が生じる（CellTableを参照）。 DataGridでは、PageSizeを設定する必要はあるが（PageSizeを超えるデータは無視されてしまう。おそらくページングをしなければ表示されない）、勝手にスクロールバーがついてくれ、列ヘッダは固定してくれるので圧倒的に楽である。

参考

• JavaDoc
  ひどいことに、このJavaDocに記述されている例はDataGridとは無関係。

• http://stackoverflow.com/questions/7713218/gwt-2-4-datagrid-auto-set-column-width

• http://markmail.org/message/ycoucw2jwfg4yxjp

サンプル

• http://rvsoni.wordpress.com/2011/10/25/gwt-datagrid-with-pagination-using-simple-pager/

DataGridの使えなさ

• DataGridでもgetVisibleRange(),getVisibleItemCount()の値は、実際にユーザに見える行数を表しているわけではなく、全データ数になってしまう。このため、大量のデータの一部のみをスクロールバーで移動しながらオンデマンドで必要なデータを取得するということはできない。結局、ページングでしかこのような仕組みは実現できないようだ（が、ページングの場合には、ブラウザのリサイズによって表示行数が変わるという問題が残る）。

しかし、GXTでもこの事情は同じようだ。以下はGXTのサンプル

import java.util.*;

import com.extjs.gxt.ui.client.data.*;
import com.extjs.gxt.ui.client.store.*;
import com.extjs.gxt.ui.client.widget.grid.*;
import com.extjs.gxt.ui.client.widget.grid.Grid;
import com.google.gwt.core.client.*;
import com.google.gwt.user.client.ui.*;

public class ImageViewer implements EntryPoint {
  
  class ModelDataAdapter implements  ModelData {
    public <X> X get(String property) { throw new RuntimeException(); }
    public Map<String, Object> getProperties() { throw new RuntimeException(); }
    public Collection<String> getPropertyNames() { throw new RuntimeException(); }
    public <X> X remove(String property) { throw new RuntimeException(); }
    public <X> X set(String property, X value) { throw new RuntimeException(); }
  }
 
  public void onModuleLoad() {
    RootLayoutPanel rootPanel = RootLayoutPanel.get();

    ColumnModel model = 
        new ColumnModel(Arrays.asList(new ColumnConfig[] { new ColumnConfig("title", 500) }));
    ListStore<ModelData> store = new ListStore<ModelData>();
    for (int i = 0; i < 1000; i++) {
      final int index = i;
      store.add(new ModelDataAdapter() {
        public String get(String name) {
          System.out.println("" + index);
          return name + index;
        }
      });
    }
    Grid<ModelData> grid = new Grid<ModelData>(store, model);

    rootPanel.add(grid);
    grid.setSize("640px", "480px");
  }
}

結局のところ、これはブラウザの情報の取得制限に関わる問題のようだ（あくまでも想像）。つまり、

• ブラウザ画面がリサイズしたとき、「表」を表示する領域の大きさを把握することができないか、あるいはその中に表示可能な行数を決定することができない。
• そこで、「ページサイズ」つまりページングをせずに表示可能な行数は固定的に決定するしかない。
• 一つの「ページ」中の行データは一度に取得する必要がある。ページ全体を表示するのにスクロールが必要だとしても、未表示の部分をオンデマンドで取得する、というわけにはいかない。